1、一、 This运行时基于函数的执行环境绑定1、 全局函数:window2、 函数作为某个对象 obj 的方法调用: obj3、 匿名函数:全局性,通常指向 window4、 修改 this 作用域:apply()、call() 。第一个参数为目标对象;第二个参数:apply 接收参数数组,call 接受参数值二、 闭包1、 定义:有权访问另一个函数作用域中变量的函数2、 实现:在一个函数内部创建另一个函数3、 变量:只能取得包含函数中任何变量的最后一个值,保存的是整个变量对象(典型:for 循环中的闭包总是返回最后一个循环的值,无法返回每次循环的值)4、 解决:在闭包内部再创建一个匿名函数fu
2、nction aa()var result;for(var i=0;i10;i+)resulti=function(num) /闭包return function() /闭包中再创建一个函数alert(num);(i);三、 块级作用域(function()/块级作用域,其中的变量在执行结束后被销毁)();四、 创建对象1、 简单方式var person = new Object();person.name = “LL”;person.age = 22;问题:创建多个相似对象,大量重复代码2、 工厂模式function Person (name,age)var o = new Object()
3、;o.name = name;o.age = age;o.getName=function()alert(this.name);return o;var person1 = new Person(“LL”,22);person1.getName() ; /”LL”(1 ) 根据接受的参数来构建一个包含所有必要信息的 Person 对象,多次调用,每次返回一个包含两个属性和一个方法的对象。(2 ) 优点:解决了创建多个相似对象的问题问题:对象识别的问题,即怎样知道一个对象的类型解决:构造函数3、 构造函数模式function Person(name,age)this.name = name;th
4、is.age = age;this.getName = function()alert(this.name);var person1 = new Person(“LL”,22);(1 )与工厂模式比较a.没有显示的创建对象;b.直接将属性和方法赋值给 this 对象;c.没有 return 语句;d.将实例标识为一种特定的类型( instanceof) ;(2 )构造函数与普通函数区别a.习惯:构造函数始终一个大写字母开头,非构造函数以一个小写字母开头b.唯一区别:调用方式不同,用 new 调用为构造函数,不用 new 为普通函数(3 ) Constructor 属性:标识对象类型person
5、1.constructor = Person;(4 ) Instanceof 操作符:检测对象类型person1 既是 Object 的实例,也是 Person 的实例person1 instanceof Object = true;person1 instanceof Person = true;(5)问题:每个方法都要在每个实例上重新创建一遍解决:将方法定义在构造函数外部新问题:方法很多定义很多全局函数自定义的类型无封装性解决:原型模式4、 原型模式function Person();Person.prototype.name = ”LL”;Person.protptype.age = 2
6、2;Person.prototype.getName = function()alert(this.name);var person1 = new Person();person1.job = “doctor”;alert(person1.name); / “LL”(1 )函数的 prototype 属性:指针,指向一个对象,该对象包含可以由特定类型的所有实例共享的属性和方法。(2 )与构造函数区别:不必在构造函数中定义对象实例的信息,将这些信息添加到原型对象中;(3 )实例中访问的都是同一组属性和方法(4 )原型对象a.函数的 prototype(原型)属性:指向函数的原型对象b.const
7、ructor(构造函数)属性:包含一个指向 prototype 属性所在函数的指针Person.prototype.constructor = Person;c.对象实例只可以访问保存在原型中的值,不可通过对象实例重写原型中的值d.为对象实例添加一个属性时,可屏蔽原型对象中的同名属性,delet 可以删除新添加的属性,重新访问原型中的属性值(5)hasOwnProperty()检测一个属性是在原型中还是实例中,实例中返回trueperson1.hasOwnProperty(“name”) = flase;person1.hasOwnProperty(job) =true;(6)原型与 in 操
8、作符a.单独使用:通过对象能够访问给定属性时返回 true,无论在原型和对象中name in person1 = true;job in person1 = true;若在实例中重写属性:person1.name = “ss”;则检测时 name 在实例总而不是原型中。b.for-in 中使用:返回所有能够通过对象访问的、可枚举的属性,包括实例和原型中的。(7)简化原型语法Person.prototype = name : “LL”;age: 22;getName: function()alert(this.name);Instanceof 不变Constructor 指向 Object 而不
9、是 Person:person1.constructor = Person 为 false;person1.constructor = Object 为 true;若 constructor 必须指向 Person:Person.prototype = constructor: Person;name : “LL”;age: 22;getName: function()alert(this.name);person1.constructor = Person 为 true;person1.constructor = Object 为 false;(8)原型的动态性:a.对原型做修改,可立即从实
10、例中反应出来;b.重写原型对象,实例仍然引用之前的原型值;( prototype 要定义在实例前)(9)原型对象的问题a.省略了为构造函数传递函数,所有实例默认下取得相同属性值;b.共享性对于函数合适,对包含引用类型值的属性存在问题:如属性为数组,定义两个实例 person1 和 person2,向 person1 数组属性添加值后也会在 person2 的同以数组属性中反应出来c因此很少单独使用原型模式5、 构造和原型组合使用(*)最常见方式function Person(name,age) /实例属性在构造函数中定义this.name = name;this.age =age; Perso
11、n.prototype= /实例的共享属性在原型中定义constructor : Person;getName : function()alert(this.name);6、 动态原型模式7、 寄生构造函数模式8、 稳妥构造函数模式五、 AjaxXMLHttpRequest 对象是基础1、 创建对象IE5、IE6var xmlhttp = new ActiveXObject(“Microsoft.XMLHTTP”);其他浏览器var xmlhttp = new XMLHttpRequest();2、 发送请求到服务器xmlhttp.open(method,url, async); 规定请求相关
12、信息method: GET 或 POSTurl:文件位置async:true(异步)或 false(同步)xmlhttp.send(string); 将请求发送到服务器string 仅用于 POST,若无参数,传入 null3、 GET 和 POST(1 ) 使用 POST 情况:更新服务器上的数据库和文件向服务器发送大量数据(POST 无数据限制)包含未知字符的用户输入时,POST 更稳定可靠(2 ) 使用 GET 发送信息直接向 URL 添加信息(3 ) 使用 POST 发送信息使用 setRequestHeader() 来添加 HTTP 头send()中规定发送的数据4、 setRequ
13、estHeader(header,value)向请求添加 HTTP 头header规定头的名称(”Content-type”)value规定头的值( ”application/x-www-form-urlencoded”)5、 异步或同步(True 或 False)(1)异步XMLHttpRequest 对象用于 AJAX,其 open()的 async 必须设为 true通过 AJAX,JavaScript 无需等待服务器的响应,而是:在等待服务器响应时执行其他脚本当响应就绪后对响应进行处理规定在响应处于 onreadystatechange 事件中的就绪状态(4)时执行的函数(2 )同步小
14、型的请求JavaScript 会等到服务器响应就绪才继续执行。如果服务器繁忙或缓慢,应用程序会挂起或停止。不编写 onreadystatechange 函数 - 把代码放到 send() 语句后面即可6、 获得服务器响应responseText获得字符串形式的响应数据,非 XML 类型响应responseXML获得 XML 形式的响应数据7、 readstatueonreadystatechange 事件:readState=4 且 status = 200 时所执行的函数8、 readyStateXMLHttpRequest 状态0: 请求未初始化1: 服务器连接已建立2: 请求已接收3:
15、请求处理中4: 请求已完成,且响应已就绪9、 state200: “OK“404: 未找到页面10、 callback 函数为创建 XMLHttpRequest 对象编写一个标准的函数,并为每个 AJAX 任务调用该函数function loadXMLDoc(url,cfunc)if (window.XMLHttpRequest) / code for IE7+, Firefox, Chrome, Opera, Safarixmlhttp=new XMLHttpRequest(); else / code for IE6, IE5xmlhttp=new ActiveXObject(“Microsoft.XMLHTTP“);xmlhttp.onreadystatechange=cfunc;xmlhttp.open(“GET“,url,true);xmlhttp.send();function callback()if(readystate = 4 loadXMLDoc(“/ajax/test.txt”,callback);