javascript

基础
区分大小写
注释

//一行注释

/*几行注释*/

严格模式
“use strict”

标识符
首字符为字母、下划线、美元符，后续字符为字母、下划线、美元符、数字。

保留字
保留的关键字，不能做标识符。

直接量（值）
数字、布尔值、字符串、null、undefined

变量
var name

数据类型
Number类型、Boolean类型、String类型、Null类型、Undefined类型、Object类型（Array数组、Function函数）

运算符
运算符优先级：

++ – - + ~ ! delete typeof void

*、/、%

+、- +

<< >> >>>

<、<=、>、>= <、<=、>、>= instanceof in

== != === !==

&

^

|

&&

||

?:

= *=、/=、%=、+=、-=、&=、^=、|=、<<=、>>=、>>>=

,

typeof：number、boolean、string、undefined、function、object

instantof：后者的原型对象是否在前者的原型链中

语句
表达式语句

复合语句i=0,j=1,k=2;

空语句;

声明语句var name=value;

条件语句（成立时执行）

if语句

if、else if、else

switch语句

switch、case、break

循环语句（不成立时跳出）

while语句

do-while语句

for语句

for(var i=0;i<6;i++)

for-in语句

for(var name in Object)

跳转语句

label语句

break语句

continue语句

return语句

作用域
没有块级作用域，只有函数作用域。

全局作用域：变量在函数外定义，函数内部外部都可以访问。

函数作用域：变量在函数内定义，函数内部可以访问，函数外部无法访问。

执行环境
定义了变量和函数有权访问的数据，环境绑定一个变量对象，环境中定义的所有变量和函数都保存在这个变量中

作用域链
作用域链的前端是当前代码所在执行环境的变量对象，接着是来自包含环境的变量对象，再接着是来自包含环境的

包含环境的变量对象，一直延续到全局执行环境的变量对象为止。

闭包
有权访问其他函数内部变量的函数。

1、

function closure(){

var a=1;b=2;

return function(){

alert(a+b);}

}

var fn=closure();

fn();

2、

function closure(){

var a=1;b=2;

var get=function(){

alert(a+b);}

return get;

}

closure()();

3、

var get,add,set;

function closure(){

var a=1;b=2;

get=function(){

alert(a+b);}

add=function(){

a++;b++;}

set=function(x,y){

a=x;b=y;}

}

closure();

get();

add();

get();

set(1,1);

get();

4、

var f = function(document){

var viewport;

var obj = {

init:function(id){

viewport = document.querySelector("#"+id);},

addChild:function(child){

viewport.appendChild(child);},

removeChild:function(child){

viewport.removeChild(child);}

}

window.jView = obj;

};

f(document);

this
构造函数
通过构造函数可以使实例定义各自的属性和方法

原型
创建一个构造函数，构造函数里包含一个prototype属性指向构造函数的原型对象，构造函数的原型对象里包含一个constructor属性指向构造函数。

通过原型对象可以使所有实例共享属性和方法。

原型链
通过父构造函数创建一个父实例，父实例通过_proto_属性指向父构造函数的原型对象，

通过子构造函数创建一个子实例，子实例通过_proto_属性指向子构造函数的原型对象，

将父实例作为子构造函数的原型对象，子构造函数的原型对象作为父构造函数的实例通过_proto_属性指向父构造函数的原型对象，

子构造函数的实例指向子构造函数的原型对象，子构造函数的原型对象又指向父构造函数的原型对象，这样就形成了原型链。

继承
借用构造函数实现继承：在子构造函数内部调用父构造函数。

借用原型链实现继承：将父实例作为子构造函数的原型对象。

组合继承：在子构造函数内部调用父构造函数，将父实例作为子构造函数的原型对象，

借用构造函数实现私有属性、方法的继承，借用原型链实现公有属性、方法的继承。

面向对象的程序设计
创建对象
1、创建Object实例，向实例添加属性方法。

2、创建对象字面量。

3、工厂模式。（用函数将1封装起来）

4、构造函数模式。（通过this对象添加属性方法）

5、原型模式。（通过prototype属性添加属性和方法）

6、构造函数模式与原型模式。

7、动态原型模式。（判断后再用prototype属性添加方法）

8、寄生构造函数模式。（类似工厂模式）

9、稳妥构造函数模式。（类似工厂模式）

继承
1、原型链。
2、借用构造函数。
3、组合继承。
4、原型式继承。
5、寄生式继承。
6、寄生组合式继承。

内置对象
Number
new Number(value);new新对象

Number(value);返回原始数

n.toString(进制数);返回字符串

n.valueOf();返回原始数

Boolean
new Boolean(value);new新对象

Boolean(value);返回原始布尔值

b.toString();返回字符串

b.valueOf();返回原始布尔值

String
new String(value);new新对象

function String(value);返回原始字符串

s.length;返回字符串长度

s.charAt(n);返回索引值处字符；“ ”；

s.indexOf(subs[,start]);返回字符索引值；-1；

s.match®;返回与正则表达式匹配的结果数组；null；

s.replace(r,news);替换与正则表达式匹配的子串

s.search®;返回与正则表达式匹配的第一个字符位置；-1；

s.split(切分处的字符串或正则表达式[,数组最大长度]);字符串切分为数组

s.slice(开始处[,结束处]);提取一个子串；参数负数为逆向数数，-1开始；

s.substr(开始处[,子串长度]);提取一个子串；参数负数为逆向数数，-1开始；

s.substring(开始处[,结束处]);提取一个子串；参数为非负；

s.toLowerCase();字符串转为小写

s.toUpperCase();字符串转为大写

s.toString();返回字符串

s.valueOf();返回原始字符串

Object
new Object([value]);new新对象

o.constructor;对象的构造函数

o.toString();对象的字符串表示形式

o.valueOf();对象的原始值

Function
new Function(参数,语句);new新对象

f.length;声明函数的形参个数

f.arguments;参数数组

f.prototype;构造函数的原型

f.apply(o,args);将函数作为对象的方法调用；参数为数组；

f.bind(o[,arg…]);返回一个作为方法调用的函数；参数为零到多个；

f.call(o,arg…);将函数作为对象的方法调用；参数为一到多个；

f.toString();返回字符串

Array
new Array([size/element…]);new新对象

a.length;数组长度

a.indexOf(value[,start]);返回数组元素索引值；-1；

a.join([分隔字符]);数组转换为字符串

a.pop();移除最后一个元素；返回最后一个元素；

a.push(value…);数组尾部添加元素；返回新数组长度；

a.shift();移除第一个元素；返回第一个元素；

a.unshift(value…);数组头部添加元素；返回新数组长度；

a.concat(value…);数组添加值；返回新数组；

a.reverse();倒序

a.slice(start[,end]);返回数组的一部分；参数负数为逆向数数，-1开始；

a.sort([排序函数]);排序

a.splice(开始处,删除元素个数,插入值);插入、删除、替换数组元素；返回删除的元素数组

a.toString();返回字符串

Date
new Date();new新对象

d.get[UTC]FullYear();返回年份值

d.get[UTC]Month();返回月份值

d.get[UTC]Date();返回月份中的日期

d.get[UTC]Day();返回一周中的日期

d.get[UTC]Hours();返回小时值

d.get[UTC]Minutes();返回分钟值

d.get[UTC]Seconds();返回秒钟值

d.getTime();返回毫秒形式

d.set[UTC]FullYear(year[,month,day]);设置年、月、日

d.set[UTC]Month(month[,day]);设置月、日

d.set[UTC]Date(day);设置月份中的日期

d.set[UTC]Hours(hours[,minutes,seconds,millis]);设置时、分、秒

d.set[UTC]Minutes(minutes[,seconds,millis]);设置分、秒

d.set[UTC]Seconds(seconds[,millis]);设置秒

d.setTime(millis);毫秒形式设置

d.toString();返回字符串

d.valueOf();转为毫秒形式

Regexp
new Regexp();new新对象

r.test(s);测试字符串是否匹配正则表达式

r.toString();返回字符串

Global
isNaN(x);是否数值；不是为true；是为false；

parseInt(s,radix);字符串转换为整数；s不是数字开头为NaN；

parseFloat(s);字符串转换为数字；s不是数字开头为NaN；

Math
m.PI;圆周率

m.abs(x);绝对值

m.ceil(x);向上取整

m.floor(x);向下取整

m.round(x);四舍五入

m.random(x);随机数

m.pow(a,b);a的b次方

m.sqrt(x);平方根

DOM
Node类型
node.nodeType节点类型

node.nodeName节点名

node.nodeValue节点值

node.childNodes子节点

node.parentNode父节点

node.previousSibling子节点中上一个同胞节点

node.nextSibling子节点中下一个同胞节点

node.firstChild子节点中第一个节点

node.lastChild子节点中最后一个节点

node.parentNode.appendChild(newNode);子节点末尾添加新节点

node.parentNode.insertBefore(newNode,someoneNode);子节点中的某一个节点前插入新节点

node.parentNode.replaceChild(newNode,someoneNode);子节点中替换某个节点

node.parentNode.removeChild(someoneNode);子节点中移除某个节点

node.cloneNode()

node.normaliza();同一个父节点的子节点中的文本节点合并

Document类型
document.documentElement;表示html元素

document.body;表示body元素

document.title;表示title元素

document.URL;表示页面URl

document.domain;表示页面域名

document.referrer;表示来源页面的URl

document.getElementById(“id名”);查找id元素

document.getElementsByTagName(“标签名”);查找标签元素

document.getElemenstByName(“属性名”);查找属性元素

document.write(s);原样写入

document.writeln(s);末尾加换行符

document.open();

document.close();

document.createElement(“标签名”);创建Element类型节点

document.createTextNode(“文本内容”);创建Text类型节点

document.createComment(“文本内容”);创建Comment类型节点

document.createDocumentFragment();创建DocumentFragment类型节点

document.createAttribute(“属性名”);创建Attr类型节点

Element类型
element.id;表示元素id属性

element.title;表示元素title属性

element.className;表示元素css类

element.getAttribute(“name”);获取属性节点

element.setAttribute(“name”,“value”);设置属性节点

element.removeAttribute(“name”);移除属性节点

Text类型
text.splitText(startnum);同一个父节点的子节点中的文本节点分割

Comment类型
comment.splitText(startnum);同一个父节点的子节点中的注释节点分割

DocumentFragment类型
Attr类型
扩展
document.querySelector(“css选择器”);查找相应的元素

document.querySelectorAll(“css选择器”);查找相应的所有元素

document.getElementsByClassName(“类名”);查找类名元素

document.readyState;加载状态complete

element.innerHTML;获取或设置元素内容

element.offsetWidth;元素在水平方向上占用的空间大小（内容加上内边距加上边框加上滚动条）

element.offsetHeight;元素在垂直方向上占用的空间大小（内容加上内边距加上边框加上滚动条）

element.offsetTop;元素的上外边框至包含元素的上内边框的像素距离

element.offsetLeft;元素的左外边框至包含元素的左内边框的像素距离

document.documentElement.clientWidth内容宽度加上内边距宽度

document.body.clientWidth

document.documentElement.clientHeight内容高度加上内边距高度

document.body.clientHeight

BOM
Window对象
window.open([surl,starget,sfeatures,sreplace])：打开窗口。返回一个指向新窗口的引用。

window.close()：关闭窗口。

window.resizeTo(w,h)：调整窗口尺寸到指定值

window.resizeBy(mx,my)：增加窗口尺寸，增加量为指定值

window.moveTo(x,y)：移动窗口

window.moveBy(mx,my)：移动窗口，坐标增加量为指定值

window.innerHeight：浏览器窗口的内部高度

window.innerWidth：浏览器窗口的内部宽度

计时器

window.setTimeout(f,delay)：超时调用

window.clearTimeout()：取消超时调用

window.setInterval(f,delay)：间歇调用

window.clearInterval()：取消间歇调用

对话框

window.alert(s)：警告框

window.confirm(s)：确认对话框。返回布尔值，点击确定返回true，点击取消返回false

window.prompt(s)：提示框。点击确定返回文本框的值，点击取消返回null

window.print(s)：打印对话框

window.find(s)：查找对话框

Navigator对象
navigator.userAgent：用户代理字符串

navigator.plugins：安装插件信息的数组

navigator.onLine：检测设备在线还是离线

Screen对象
screen.availWidth：可用的屏幕宽度。以像素计，减去界面特性，比如窗口任务栏。

screen.availHeight：可用的屏幕高度。以像素计，减去界面特性，比如窗口任务栏。

screen.width：屏幕的像素宽度

screen.height：屏幕的像素高度

screen.colorDepth：颜色位数

History对象
history.go(num)：跳转到任意历史记录。若传入整数，正数为前进，负数为后退。若传入字符串，则跳转到历史记录中包含该字符串的第一个位置。

history.back()：后退一页

history.forward()：前进一页

history.length：历史记录的数量。对于窗口中第一个打开的页面而言，其history.length为0。

history.pushState()：历史状态管理。将新的状态信息加入历史状态栈。

history.replaceState：历史状态管理。重写历史状态

Location对象
属性

location.href：完整URL，如http://www.bnu.edu.cn:8080/path/to/homepage/index.html?name=‘peter’&age=‘20’#contents

location.protocol：协议名，如http:

location.host：服务器名及端口号，如www.bnu.edu.cn:8080

location.hostname：服务器名，如www.bnu.edu.cn

location.port：端口号，如8080

location.pathname：目录和文件名，如/path/to/homepage/index.html

location.search：查询字符串，以问好开头，如?name=‘peter’&age=‘20’

location.hash：散列值，即#号后面，如#contents

方法

location.assign(surl)：打开指定URL，并在历史记录中生成一条记录。等价于location.href = URL和window.location = URL。

location.replace(surl)：打开指定URL，但不生成新的历史记录。

location.reload()：重新加载当前页面。默认以最有效的方式加载，可能会请求到缓存。

location.reload(true)：重新加载当前页面，强制从服务器重新加载。

Event
eventtarget.addEventListener(事件类型,事件处理函数,false);添加事件处理函数

eventtarget.attachEvent(on事件类型,事件处理函数);IE添加事件处理函数

eventtarget.removeEventListener(事件类型,事件处理函数,false);移除事件处理函数

eventtarget.detachEvent(on事件类型,事件处理函数);IE移除事件处理函数

event.preventDefault();取消事件默认行为

event.returnValue=false;

event.stopPropagation();阻止事件冒泡

event.cancelBubble=true;

Window事件
window.onload;页面加载完成时触发（包括图片、音频、视频等资源）

window.onscroll;滚动条滚动时触发

document.documentElement.scrollTop||document.body.scrollTop;滚动条位置

window.onresize;窗口大小改变时触发

window.onmousewheel;鼠标滚动时触发

event.wheelDelta;==-120向下滚

window.DOMMouseScroll;火狐鼠标滚动时触发

event.detail;=3向下滚

window.onunload;退出页面时触发

Document事件
document.onreadystatechange;页面加载时触发

document.readyState;加载状态complete

document.ontouchstart;手指触摸屏幕时触发

event.touches[0].pageX;

document.ontouchmove;手指触摸屏幕的位置改变时触发

document.ontouchend;手指移开屏幕时触发

event.changedTouches[0].pageX;

document.onDOMContentLoaded;页面加载完成时触发（不包括图片、音频、视频等资源）

Element事件
element.onclick;鼠标点击时触发

element.ondblclick;鼠标双击时触发

element.onmouseover;鼠标移动到元素上时触发

element.mouseenter;鼠标移动到元素上时触发（不冒泡）

element.onmouseout;鼠标移动到另一元素上时触发

element.mouseleave;鼠标移动到另一元素上时触发（不冒泡）

element.onmousedown;鼠标按下时触发

element.onmousemove;鼠标移动时触发

element.onmouseup;鼠标松开时触发

element.onkeydown;键盘任意键按下时触发

element.onkeypress;键盘字符键按下时触发

element.onkeyup;键盘任意键弹起时触发

element.onabort;无法加载嵌入内容时触发

element.onerror;无法加载js、图像、嵌入内容、框架时触发

Form事件
form.elements[];表单元素列表

formelement.disabled;是否被禁用

formelement.value;提交值

formelement.onsubmit;表单提交时触发

formelement.onreset;表单重置时触发

formelement.focus();表单元素获得焦点

formelement.onfocus;表单元素获得焦点时触发

formelement.blur();表单元素移除焦点

formelement.onblur;表单元素移除焦点时触发

formelement.select();文本框获得焦点时选中文本

formelement.onselect;选中文本框文本时触发

formelement.onchange;文本内容变化时触发

Ajax
new XMLHttpRequest();创建XMLHttpRequest对象

ajax.open(“GET或POST”,“文件位置”,true异步或false同步);设置ajax请求

ajax.setRequestHeader();

ajax.send();发送ajax请求

ajax.onreadystatechange;ajax请求时触发

ajax.readyState;4请求完成响应就绪

ajax.status;200找到页面

ajax.getRequestHeader();

ajax.responseText;字符串形式的响应数据

JSON
data=JSON.parse(ajax.responseText);JSON数据转换为js数据

JSON.parse(jsonText[,function]);

jsonText=JSON.stringify(javascriptText[,array or function][,number or string]);js数据转换为JSON数据

toJSON();对象中定义toJSON()方法过滤