博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
JavaScript基础
阅读量:5233 次
发布时间:2019-06-14

本文共 7498 字,大约阅读时间需要 24 分钟。

一、基本规则

       1.JavaScript 是 Web 的编程语言,所有现代的 HTML 页面都使用 JavaScript,是一种轻量级的编程语言。

       2.语句都以分号结束,但分号也可以省略;

       3.脚本必须位于HTML的<script></script>标签内,可放在<head>和<body>标签内;但通常都放在<head>或者是页面底部;

       4.数据类型有Number,String,Boolean,Array([]),Object,变量用关键字var来进行声明;

       5.输出方法:

document.write(“string")      直接写入HTMLl输出流;    window.alert("string")        弹出警告框;    console.log("string")         写入到浏览器控制台,主要用于调试程序使用;    innerHTML                     写入到 HTML 元素,一般需要先定位到某一元素;

       6.//注释; /*多行注释*/

       7.JavaScript区分大小写,一般命名用驼峰;

       8.对于一行代码跨多行可用转义字符\来进行连接;

       9.脚本语言是逐行执行的,而不是像C语言一样会先把所有的代码都编译一次再执行;

       10.debugger;        此语句相当于断点,脚本会在此处停止执行;

 

二、运算符

       1.赋值:= += -= *= /= %=

       2.算术:+ - * / % ++ --

       3.比较:== != > <  >= <= === !==

       4.逻辑:&& || !

       5.条件:? :

       (同类型比较==和===一样,不同类型比较==会将两种类型转换为同一类型后对值进行比较,===的结果就是不等;

       数值与null相加不影响结果,string与null相加结果为null;)    

 

三、声明

1.无论常量还是变量,使用前都应该先用var声明,同时也可以直接赋值。

       也可以用new来声明变量类型(例:var a = new Number;)

       同时声明多个变量用逗号隔开;

2.令一个变量值等于null,那么这个变量就是undefined;     

3.数组的声明有四种方式:

var ar = new Array('a','b');var ar = ['a','b'];var ar = new Array();var ar = [ ];

4.object声明(object是拥有属性和方法的数据,是一个容器)

       var ob = {name:"x",name2:"y"};

       可通过ob.name或者ob["name"]两种方式来获取name的值x;如果name的值是一个方法则需要在使用name(),如果不加括号则会得到方法的语句而不是方法运行的结果;

       常用两种创建对象方式:

1)function ob(){        var obj = new Object();        obj.name = "x";        obj.name2 = "y";        return obj;    }
2)function ob(){        this.name = "x";        this.name2 = "y";    }

       (对象的创建时可以有构造函数,类似于class的构造函数;)      

5.变量提升:JavaScript变量可以先使用后声明,因为函数及变量的声明在运行时都被被提升到函数的最顶部;但只会提升只声明的变量,如果声明同时初始化了则不会被提升;

"use strict";           

6.严格模式,在1.8.5中新增,如果使用此模式,则不允许使用未声明的变量;不允许删除变量、变量重名、使用八进制、使用转义字符;只能用在脚本或者一个函数的开头;

7.javaScript中很多时候要避免使用new关键字;  

 

四、数据类型:

(一)Number           

既可以表示小数也可以表示整数,所有的数据都是64位的;以0开头为八进制,0x表示十六进制;

属性有:

MAX_VALUEMIN_VALUENEGATIVE_INFINITYPOSITIVE_INFINITYNaNprototypeconstructor

方法有:

toExponential()toFixed()toPrecision()toString()valueOf()

(二)字符串(string)

       1.可以使用单引号或者双引号包围;

       2.字符串其实是个数组,可用[0]索引来取得每一个位置的元素;

       3.可用length属性来计算一个字符串的长度(如:st.length)

       4.可使用+号来连接两个字符串为一个;

       5.属性:

       length

       prototype

       constructor

       6.字符串方法:

charAt(int)                返回指定索引位置字符;    charCodeAt(int)            返回指定索引位置字符的Unicode值;    concat(str1,str2,..)       连接两个或多个字符串,也可使用+号;    fromCharCode()             将Unicode编码转换为字符;    indexOf()                  返回指定字符串值在字符串中首次出现的位置;    lastIndexOf()              指定字符串值在字符串中最后一次出现的位置;    match(reg)                 查找到一个或多个正则表达式的匹配;    search()                   查找一个字符串或正则表达式,找到则返回第一个字符的位置索引,未找到则返回-1;    replace(str1,str2)         用str2替换原字符串中的str1;    slice(startInt,endInt)     返回一个字符串指定索引之间的字符串,包含startInt位置字符,不包含endInt位置字符,endInt可选,如不给定则默认到字符串结尾;    splite()                   把字符串按关键字分割,分割内容不包含关键字;    substr(startInt,length)    返回从指定位置开始,到指定长度的字符串,如果没给定lengh,则默认到字符串结尾;        substring(from,to)         同slice();    toLowerCase()              转换为小写;    toUpperCase()              转换为大写;    trim()                     去除字符串两边空白;    valueOf()                  返回某个字符串对象变量的值;        anchor()                   创建html锚;    big()                      大号字体;    small()                    小号字体;    blink()                    闪烁字体;    bold()                     粗体;    fixed()                    以打字机文本显示;    fontcolor()                字体颜色;    fontsize()                 字体大小;    italics()                  斜体;    link()                     链接样式;    strike()                  删除线;    sub()                      以下标显示;    sup()                      以上标显示;

(三)数据类型转换(显式):

String(N)          将数据转换为字符串类型,数字等的方法toString()也是相同的作用;

Number(S)            将数据转换为数字类型;

(如果没有进行类型转换而将两各不同的数据类型进行运算时,javaScript会自动隐式的进行数据类型的转换;)

typeof varName             返回varName的数据类型,不过数组返回的类型是object;

varName.constructor;  返回所有变量的构造函数(如数值的为Number())

null和undefined值相同,都可以用来清空变量的值,但类型不同,null的类型是object,undefined类型是undefined;

 

五、结构语句

1.if...else...

格式:

if(condition){    section;}else if(condition){    section;}else{    section;} (除了if的结构都是可选的;)

2.switch语句

switch(n)    {        case 0:        break;        case 1:        break;        ...        default:    }

3.for循环

for(var i=0;i

4.for...in循环(遍历对象属性)

for(x in objectX)    {        suitcase;    }

5.while循环

while(condition)    {        suitcase;    }

6.do...while循环

do    {        suitcase;    }while(condition);

所有循环都可以使用continue来跳出当前循环,使用break来跳出整个循环.

 

六、函数

1.格式:

function functionName(parameters){

       setion;

}

(参数不需要类型;

函数可以有返回值,返回值使用return;)

2.作用域:

JavaScript分全局作用域和局部作用域,函数内定义的变量为局部变量,函数外定义的为全局变量,全局变量是window对象,所有变量名都可以使用window.varName;

如果把值赋给尚未声明的变量,该变量将被自动作为全局变量声明。

3.匿名函数:可以在function后边省略掉函数名;在定义时就已调用;

4.自调函数:即会自动调用的函数,相当于函数定义后不需要其他调用就会自己运行一次。函数体需被包围在()内,后边再接一个()来表明这是一个自调函数;

格式示例:(function(){var x = "hello!";})();

5.如果在调用函数时未给定需要的参数,那么这个参数在使用时就是undefined类型数据;可用x = x || 0 来设定未给参数值的情况,或使用x === undefined来进行判断;

函数有一内置arguments对象,是一个包含所有参数的数组;

6.异常处理:

抓取:try{}catch{}

抛出:throw  exception       (exception可以是string,number,boolean,object)

 

七、正则表达式

1.格式:/pattern/modifiers

2.修饰符:

i        不区分大小写;g        全局匹配,即匹配所有的项而非只是第一项;m        多行匹配;

3.主体规则:

[]        范围[^]       匹配不是范围内的结果;(x|y)     匹配x,y;.         匹配除换行符和结束符外的任何字符;\w        匹配字母;\W        匹配非字母;\d        匹配数字;\D        匹配非数字;\s        匹配空白字符;\S        匹配非空白字符;\b        匹配单词边界;\B        匹配非边界;\0        匹配null字符;\n        匹配换行符;\f        匹配换页符;\r        匹配回车符;\t        匹配制表符;\v        匹配垂直制表符;\xxx      匹配以八进制数xxx规定的字符;\xdd      匹配以十六进制数dd规定的字符;\uxxxx    匹配以十六进制数xxxx规定的Unicode字符;{X,Y}     匹配最少X最多Y个的结果,可省略Y表示最少X次,可省略逗号和Y表示X次;*         匹配0至多个;+         匹配1至多个;?         匹配0至1个;^         开头;$         结尾;?=        匹配其后为指定内容的字符串;?!        匹配其后不为指定内容的字符串;

4.RegExp

是一个包含属性和方法的正则表达式对象,实例时应使用new RegExp("pattern","modifiers");

常用方法:

stringName.match(reg)            从字符串中查找匹配字符,返回匹配到的字符串;stringName.search(reg)           从字符串中查找匹配字符,返回匹配字符的起始位置;stringName.replace(reg,string)   从字符串中替换匹配字符;reg.test(string)                 一个正则表达式在字符串中是否有匹配结果,如果有则返回true;reg.exec(string)                 一个正则表达式在字符串中是否有匹配结果,如果有则返回匹配结果数组;reg.compile()                    编译正则表达式;

 

八、事件

指浏览器或者用户的行为;

1.常见HTML事件:

onchange          HTML元素改变;    onload            浏览器加载页面完成时;    onclick           用户点击时;    onmouseover       鼠标在一个HTML元素上时;    onmouseout        鼠标在一个HTML元素上移开时;    onkeydown         按下键盘时;    (更多可见HTML文档的事件)

2.键盘鼠标事件对象:

altKey             返回事件被触发时,alt是否被按下;    ctrlKey            返回ctrl键是否被按下;    shiftKey           返回shift键是否被按下;    metaKey            返回meta键是否被按下;    button             返回哪个鼠标按钮被点击;    clientX            返回指针的水平位置;    clientY            返回指针的垂直位置;    location           返回按键在设备上的位置;    key                返回按下按键的标识符;    charCode           返回onkeypress事件触发键值字母代码;    keyCode            返回onkeypress事件触发的键值字符代码;    which              返回onkeypress事件触发的键值字符代码;    relatedTarget      返回与事件的目标节点相关的节点;    screenX            返回某个事件被触发时鼠标指针的水平坐标;    screenY            返回某个事件被触发时鼠标指针的垂直坐标;

 

九、其他

1.元素定位:

document.getElementById(" ");

document.getElementByTagName(" ");

document.getElementByClassName(" ");

document是在全局范围内查找,也可以使用一个变量或者范围;

如果要在查找一个元素之后改变元素的内容,可以使用innerHTML来实现,例:document.getElementById("xx")="示例内容";

也可改变元素的属性,只要在后边加上相应的.attribute = newAttributeValue即可将原属性值改为新的值;

document.getElementById(id).style.property=新样式   改变元素样式;

 

2.监听:

element.addEventListener(event, function, useCapture);

用于向指定元素添加事件句柄,添加的事件句柄不会覆盖已存在的事件句柄,你可以向一个元素添加多个事件句柄。可以向任何 DOM 对象添加事件监听,不仅仅是 HTML 元素。

其中的event不要使用on前缀 ;

element.removeEventListener();方法可用来移除由addEventListener()方法添加的事件句柄;

 

3.创建新的元素:

var para=document.createElement("p");

var node=document.createTextNode("这是一个新段落。");

para.appendChild(node); //追加这个元素的文本节点;

element.appendChild(para); //在已存在元素后添加新元素;

para.removeChild(child);  //移除para元素的子元素child;

 

4、eval()      将字符串作为脚本代码来执行。

转载于:https://www.cnblogs.com/aland-1415/p/8848118.html

你可能感兴趣的文章
javascript面相对象编程,封装与继承
查看>>
Atlas命名空间Sys.Data下控件介绍——DataColumn,DataRow和DataTable
查看>>
Java中正则表达式的使用
查看>>
算法之搜索篇
查看>>
新的开始
查看>>
java Facade模式
查看>>
NYOJ 120校园网络(有向图的强连通分量)(Kosaraju算法)
查看>>
SpringAop与AspectJ
查看>>
Leetcode 226: Invert Binary Tree
查看>>
http站点转https站点教程
查看>>
解决miner.start() 返回null
查看>>
bzoj 2007: [Noi2010]海拔【最小割+dijskstra】
查看>>
BZOJ 1001--[BeiJing2006]狼抓兔子(最短路&对偶图)
查看>>
C# Dynamic通用反序列化Json类型并遍历属性比较
查看>>
128 Longest Consecutive Sequence 一个无序整数数组中找到最长连续序列
查看>>
定制jackson的自定义序列化(null值的处理)
查看>>
auth模块
查看>>
javascript keycode大全
查看>>
前台freemark获取后台的值
查看>>
log4j.properties的作用
查看>>