javascript知识总结

javascript：

面对对象

函数创建方式：

1.工厂模式

function createPerson(name, age, job){
var o = new Object(); //创建工厂对象模型
o.name = name;
o.age = age;
o.job = job;
o.sayName = function(){
alert(this.name);
};
return o;
}
var person1 = createPerson("Nicholas", 29, "Software Engineer");
var person2 = createPerson("Greg", 27, "Doctor");
Fac

工厂模式抽象了创建具体对象的过程，首先抽象一个工厂对象creatPerson，然后定义一个包含着公共属性的对象模型o，最后返回这个对象模型，o作用域在函数内，相当于返回一个实例对象

2.构造函数模式

function Person(name, age, job){
this.name = name;
this.age = age;
this.job = job;
this.sayName = function(){
alert(this.name);
};
}
var person1 = new Person("Nicholas", 29, "Software Engineer");
var person2 = new Person("Greg", 27, "Doctor");

在这个例子中， Person() 函数取代了 createPerson() 函数。我们注意到， Person() 中的代码
除了与 createPerson() 中相同的部分外，还存在以下不同之处：
 没有显式地创建对象；
 直接将属性和方法赋给了 this 对象；
 没有 return 语句；

 Person 使用的是大写字母 P。按照惯例，构造函数始终都应该以一个大写字母开头，而非构造函数则应该以一个小写字母开头

3.原型模式

function Person(){
}
Person.prototype.name = "Nicholas";
Person.prototype.age = 29;
Person.prototype.job = "Software Engineer";
Person.prototype.sayName = function(){
alert(this.name);
};
var person1 = new Person();
person1.sayName(); //"Nicholas"
var person2 = new Person();

person2.sayName(); //"Nicholas"
alert(person1.sayName == person2.sayName); //true

原型：http://www.108js.com/article/article1/10201.html?id=1092

 

4.组合使用构造函数模式和原型模式

function Person(name, age, job){
this.name = name;
this.age = age;
this.job = job;
this.friends = ["Shelby", "Court"];
}
Person.prototype = {
constructor : Person,
sayName : function(){
alert(this.name);
}
}
var person1 = new Person("Nicholas", 29, "Software Engineer");
var person2 = new Person("Greg", 27, "Doctor");
person1.friends.push("Van");
alert(person1.friends); //"Shelby,Count,Van"
alert(person2.friends); //"Shelby,Count"
alert(person1.friends === person2.friends); //false
alert(person1.sayName === person2.sayName); //true

 

5.动态原型模式

function Person(name, age, job){
//属性
this.name = name;
this.age = age;
this.job = job;
// 方法
if (typeof this.sayName != "function"){
Person.prototype.sayName = function(){
alert(this.name);
};
}
}
var friend = new Person("Nicholas", 29, "Software Engineer");
friend.sayName();

 

6.寄生构造函数模式

function Person(name, age, job){
var o = new Object();
o.name = name;
o.age = age;
o.job = job;
o.sayName = function(){
alert(this.name);
};
return o;
}
var friend = new Person("Nicholas", 29, "Software Engineer");
friend.sayName(); //"Nicholas"

 

7.稳妥构造函数模式

function Person(name, age, job){
//创建要返回的对象
var o = new Object();
//可以在这里定义私有变量和函数
//添加方法
o.sayName = function(){
alert(name);
};
//返回对象
return o;
}

闭包：

继承：

 

api：两种分类

https://www.kancloud.cn/dennis/tgjavascript/241852

      1.节点、2.css、3、对象

http://blog.csdn.net/strommaybin/article/details/52725950

1. 元素查找
2. class操作
3. 节点操作
4. 属性操作
5. 内容操作
6. css操作
7. 位置大小
8. 事件
9. DOM加载完毕
10. 绑定上下文
11. 去除空格
12. Ajax
13. JSON处理
14. 节点遍历

http://devdocs.io 所有api

 

数据交互方式：

web数据交互，简单的讲，是client与server端的数据交互，通过http协议交互的。

首先看一个传统的页面请求的生命周期：

1. 浏览器发送一个HTTP请求到Web服务器。
2. Web服务器解析请求，然后读取数据存储层，制定一个HTML文件，并用一个HTTP响应把它发送到客户端。
3. HTTP响应通过互联网传送到浏览器。
4. 浏览器解析Web服务器的响应，使用HTML文件构建了一个的DOM树，并且下载引用的CSS和JavaScript文件。
5. CSS资源下载后，浏览器解析它们，并将它们应用到DOM树。
6. JavaScript资源下载后，浏览器解析并执行它们。 
 上述6个步骤是一个web页面展现必不可少的，都要经历的步骤，每个步骤花的时间都会影响页面的展现的快慢的，以后会讲下性能优化，这里主要讲web交互方式，先略过。

 web数据交互，从server的角度讲：主要有pull，push两个,一个是拉，另外一个是推。

1）pull 是拉，客户端向服务器端主动的拉取数据，采用的技术是ajax 和Xss（跨站脚本）

2）push 是服务器向客户端主动的推动数据，第一种方式是长连接，客户端与服务器之间一直保持着连接，如果有数据的更新，服务器向客户端推送数据，客户端接受服务器端的数据，可以理解为长轮询，客户端与服务器端必须一直是连接着的状态。另外还有一种是伪长链接的。有2种实现方式，一种是基于ajax的，它与传统的ajax的方式不同在于，服务器端会阻塞客户端的请求直到有数据传递或者超时才返回。客户端 JavaScript 响应处理函数会在处理完服务器返回的信息后，再次发出请求，重新建立连接。 当客户端处理接收的数据、重新建立连接时，服务器端可能有新的数据到达；这些信息会被服务器端保存直到客户端重新建立连接，客户端会一次把当前服务器端所有的信息取回。