javascript学习笔记

Javascript的重要知识点

javaScript两大主要特征

1、javaScript是单线程执行的

从上往下，一步一步执行

2、javaScript是解释性语言

js的执行过程分三步：语法分析、预编译、解释执行

语法分析：就是全盘去扫描，看有没有语法错误

預编译四个步骤：（预编译发生在函数执行之前）

1、创建AO对象

2、找形参和变量声明，并把形参和变量声明作为AO对象的属性，值为undifined

3、把实参值赋给形参

4、在函数体里找到函数声明，值赋予函数体

任何对象，如果未经声明直接赋值，此变量就为全局变量所有。

逻辑运算符，&&与，||或，!非

在js里面，所有类型都可以转换成布尔值，其中：undifined ，“”，NaN，false，0，null转换之后都是false

&&(与)：寻假，遇到false返回当前表达式的值，如果是最后一个，直接返回

||(或)：寻真，遇到true就返回当前表达式的值，如果是最后一个，直接返回

1、javascript中的变量有两种：原始值和引用值

2、包装类

3、原型： prototype

4、Object.create(原型)

5、this:预编译的时候this指向window

谁调用的，this指向谁

call apply

全局的，this 指向windo

js可以间接改改css,可读写行间样式，没有兼容性问题，碰到float这样的保留字属性，前面应加css:div.style.cssFloat

div.style.width = "200px"

复合属性要拆解，比如：border

查询计算样式,只能查询，不能更改，获取的值最终都是经过计算的

window.getComputedStyle(div,null);

这个方法也是只能查询，返回的是原始值，没有经过计算

div.currentStyle

数组：

数组的定义方法

1、var arr = [];

2、var arr= new Array();

两种方法唯一的区别就是：只传一个参数的时候，第二种方法表示数组的长度

数组就是特殊的对象

数组可以溢出读，但返回结果是undifined

数组常用方法：

1、改变原数组：push、pop、shift、unshift、sort、reverse、splice

2、不改变原数组：concat、join、tostring、slice

push():往数组最后一位加内容，也可以传多个参数

pop():把数组最后一位移除，不用传参，不管传什么都是移除最后一位

unshift():往数组第一位加内容，可以传多个参数

shift()：把数组第一位移除

reverse()：把数组逆转

splice(从第几位开始（负数表示从倒数第几位），截取的长度，在切口处增加新数据):返回截取的数组

sort()：给数组排序，可以自定义写sort

concat():把两个数组连接起来

slice()：截取数组

join()：把数组按传的字符串连接起来并返回字符串

类数组：属性为索引（数字），必须有length属性，最好加上push

var obj = {

"0" : 'a',

"1" : 'b',

"2" : ‘c’,

"length":3,

"push":Array.pototype.push

}

事件：

事件绑定

1、on+事件名称，兼容性好，但一个对象只能绑定一个事件

div.onclick function)_{

....

}

2、可以绑定多个事件，会按绑定的顺序执行

div.addEventListener('click',事件处理函数，false);

解除事件处理程序

1、div.onclick = null

2、div.removeEventListener('click',事件处理函数，false );

事件冒泡

结构上（非视觉上）嵌套的元素，会存在事件冒泡，自子元素冒泡向父元素

事件捕获（与冒泡相反）

结构上嵌套关系的元素，会存在事件捕获，自父元素捕获至子元素，IE没有捕获事件，先捕获后冒泡

取消冒泡

e.stopPropagation

e.cancleBubble = ture

阴止默认事件

1、return false ;以对象属性的方式注册事件才生效

2、e.preventDefault();

3、e.returnValue = false

事件委托

json.strintify(obj);把strint转换成json

json.parse(str);把json转换成string

异步加载

1、defer 异步加载，但要等到dom文档全部解析完才会执行，只有IE能用，也可以写到代码内部

2、aysnc 异步加载，加载完就执行，aysnc只能加载外部脚本，不能把js写在script标签里面，IE9以下不能用，其它都可以

3、创建script，插入到dom里面，加载完毕后callback

js加载时间线

1、创建document对象，开始解析web页面。解析html元素和他们的文本内容添加element对象和text节点到文档中。这个阶段document.readystate = 'loading'

2、遇到link处部css，创建线程加载，并继续解析文档

3、遇到script外部js，并且没有设置sync和defer，浏览器加载并阻塞，等待js加载完成

4、遇到script外部js,并且设置有async和defer，浏览器创建线程加载，并继续解析文档，对于async的属性脚本，脚本加载完成后立即执行

5、遇到img等，先正常解析dom结构，然后浏览器异步加载src，并继续解析文档

6、当文档解析完成，domcument.readystate = 'interactive'

7、文档解析完成后，所有设置有defer的脚本会按照顺序执行

8、document对象触发domcontentloaded事件，这也标志着程序从同步脚本执行阶段，转化为事件驱动阶段

9、当所有async的脚本加载完成并执行后，img等加载完成后，document.readystate = 'complete'，window对象触发load事件

正则表达式

两种创建方式

1、直接量 var reg = /abc/;

2、new RegExp();

推荐使用直接量

reg.test();

str.match();

修饰符

1、i 忽略大小写

2、g 全局匹配

3、m 多行匹配

元字符和表达式

1、\w ==[0-9A-z_] \W == [^\w]

2、\d == [0-9] \D == [^\d]