JavaScrip

============================================================================================

•  js基于原型继承，并且是参考self语言来实现的。
•   判断一个变量什么类型用typeof,  类型有：undefined,number,string,boolean,function,object前四种为基本数据类型，后两种为引用类型，因为typeof判断引用类型时不是返回object就是function，但具体类型是什么就得要instanceof来判断了。(obj instanceof 构造函数)
• instanceof是表示为...的实例，所以只能用于引用类型，如果变量是基本类型返回值始终都为false。
• 只要是引用类型（也就是对象）都是由函数创建的。形如var a=[1,2];var b={key:value}都只不过是语法糖形式，其能转换为var a=new Array();a[0]=1;a[1]=2; var b=new Object(); b.key=value; 其中Array和Object为函数。所以语句a instanceof XXX,就表示判断a对象是由XXX函数创建的。
• 一切对象都是属性的集合，属性可能是变量，方法。
• 函数有二重性，即是对象类型，也可以用来创建对象。既然是对象类型就可以有fn.attr=10;这种写法；所有对象都由函数创建，这是通过函数的prototype属性实现。
• 每个函数都有prototype属性，它的值是个对象，每个对象都有一个隐藏的__proto__属性，这个__proto__属性引用创建该对象的函数的prototype属性。函数的prototype属性的constructor属性引用本函数自身。
• 为什么函数有prototype属性？因为js要在语言层面实现继承，但是没有相应的class,extends，所以用prototype来实现原型继承，由于函数有特殊的性质，它即可以当函数来执行，又可以做为对象的属性集合，所以给函数默认赋了prototype属性来实现继承，它是如何用prototype来实现继承的？ 通过new functionName()可以将该函数当做构造函数来执行，因为它是函数所以可以执行代码，再将新生成的对象的__proto__赋值上函数的prototype属性，因为函数又可看做对象可以有属性集合，其中就包含用于继承的prototype属性。
• 每个函数都有prototype属性，这个属性是一个对象，它里面有两个元素：construtor, __proto__

constructor是一个函数，它引用函数本身，这个是为了新生成的对象通过__proto__.constructor可以找到创建本对象的函数。

__proto__是一个对象，属性集合，为生成的对象提供代码复用，也就是继承的目的。默认情况下，直接继承自Object.prototype

函数.prototype表示函数自身的key-value集合。（不包括在构造函数内定义的属性）

函数.prototype.__proto__表示父类的key-value集合。（不包括在构造函数内定义的属性）

obj.__proto__===obj.__proto__.constructor.prototype表示创建对象的函数的prototype。

obj.__proto__.__proto__表示父类的构造函数的prototype。

• Object.prototype对象的__proto__是null,特例
• 函数是被创建Function出来的：function Fn(a,b){return a+b;}===new Function("a","b","return a+b;");
• Object.__proto__===Function.prototype
• Function.__proto__===Function.prototype，特例，说明Function是自创建的。
• 原型链：Foo.prototype.__proto__引用Object.prototype或者父类的prototype,所有对象的祖先是Object.prototype，它的属性有：constructor,hasOwnProperty,isPropertyof,propertyIsEnumerable,toLocaleString,toString,valueOf,__proto__

Object instanceof Function === true

Function instanceof Object === true

Function instanceof Function === true

Object instanceof Object === true

函数/Function/Object.__proto__ ==(Function.prototype)对象====>函数由Function创建

Function.prototype自身有的属性call,apply,length,arguments,caller,所以所有函数都有这些属性

Function.prototype.__proto__==(Object.prototype)对象 ====>Function.prototype由Object创建

多层继承：Employee.prototype=new Person();

hasOwnProperty 判断是自身的属性而不是prototype的。

prototype也可以由自己定义对象赋值，这样就可以构成原型链，instanceof就是按照原型链查找判断某对象是不是某种类型或者父类型。

============================================================================================

执行上下文环境:

执行上下文环境是按作用域来划分范围的。作用域有全局作用域和函数作用域。

在网页代码加载完成时全局上下文环境需要做准备工作（预解析阶段），同理每进入一个作用域（函数）都会做预解析：

• 变量、函数表达式——变量声明，默认赋值为undefined；
• this——赋值；this在任何情况下都是有值的。
• 函数声明——赋值；
• 函数参数——赋值；
• arguments——赋值；
• 自由变量——找到自由变量的“创建”作用域并赋值；
• 
  

准备工作完成后，再从上往下执行代码。

case1: console.log(a); //error

case2: console.log(a); var a=10; //undefined

case3: console.log(f1); var f1=function f1(){}; //undefined

case4: console.log(f1); function f1(){}; //function f1(){}

函数每被调用一次，都会产生一个新的执行上下文环境 。 并且隐式的给arguments赋值。

============================================================================================================

作用域：

javascript没有块级作用域：if(true){var name='test';} console.log(name);//test

javascript除了全局作用域之外，只有函数可以创建的作用域

作用域最大的用处就是隔离变量，不同作用域下同名变量不会有冲突

作用域中变量的值是在执行过程中的“执行上下文”中产生的，而“作用域”却是在函数创建时就确定了

============================================================================================================

执行上下文栈:

每次调用函数都又会产生执行上下文环境, 形成 执行上下文栈， 处于活动状态的执行上下文环境只有一个 。有压栈出栈的过程。

=============================================================================================================

自由变量： 在A作用域中使用的变量x，却没有在A作用域中声明（即在其他作用域中声明的）

要到创建这个函数的那个作用域中取值——是“创建”，而不是“调用”，切记切记 ——其实这就是所谓的“静态作用域”。 如果 “创建” 作用域范围没有此自由变量定义，会沿着作用域范围向上层一级一级查找。

var x = 10; function a(){console.log(x)} function b(){var x=20; a();} b(); //结果=10 

==============================================================================================

作用域链 ：

如果要查找一个作用域下某个变量的值，就需要找到这个作用域对应的执行上下文环境，再在其中寻找变量的值。如果当前作用域未找到某变量它会沿着作用域链向上查找，注意：要到创建这个函数的那个作用域中取值，而非调用的作用域取值，这就是所谓的“静态作用域”

=========================================================================================================

this:

this在函数定义处不能判定，只能在调用时判断this，谁调用的函数this就是谁。

函数内定义的函数也只不过是一个普通函数，只是在全局作用域下访问不到，闭包就是利用访问不到来模拟类的封装。

通过其它办法可以访问到，它其实是一个普通函数，所以this指向的是window：

var a = { f1: function(){ function f2(){console.log(this)} f2();} } ; a.f1(); //window

=============================================================================================

函数存在形式或调用形式有：普通函数（全局函数）,构造函数,属性函数，call/apply调用形式，其中构造函数中的this为用该构造函数创建出来的对象，普通函数的this始终为window

============================================================================================

闭包的应用：1，函数作为返回值，2，函数作为参数传递，闭包是组织代码与数据的一种方法论，它与类或原型继承相似，它是传入一些参数，返回一个可执行代码的一个接口（function）。这些参数可以只为其该接口使用，起到封装的作用。它的好处是使用简单，缺点是上层作用域的上下文环境不能销毁，可能引起内存泄露。

============================================================================================

重点总结：

原型提供了继承机制，可以代码复用。

闭包提供的封装机制，可以隐藏细节。

自由变量按照静态作用域链向上查找。

嵌套函数只是普通函数，只是访问受限，它的this指向window。

============================================================================================

七种类型：undefined,null,boolean,number,string,object,function,对任何标识符，变量，参数使用typeof运算得到结果不会超过这七种类型

js代码只体现为一种形式：function,代码也是数据，其值就是代码逻辑，并且可以动态修改，也可以调用执行

只有object类型和function类型具有对象化的能力

每执行一个函数就会创建一个新作用域，首先先预编译，将该方法内定义的函数转为变量，再执行从头执行代码，var的变量只能在本作用域内访问到，如果一个变量在本作用域找不到，会到上个作用域去找。

系统提供的函数操作, arguments, caller,name,prototype,call,apply,this

系统提供的对象操作,constructor

对象表示形式：第一种是json,第二种是通过定义函数，再new functionname()--·[1,设置原型链，2,初始化],第二种形式的本质是

function Person(name){this.name=name}

var lewis={}

Person(lewis,"venlv");

lewis.prototype=Person.prototype(lewis.prototype对外是不可见的)

prototype是函数类型的一个属性，protoytpe是一个object的对象

原型与直接设置函数属性区别，用原型创建的对象只保留一份函数，而直接设置的函数属性，每次创建都会有一份函数逻辑

原型提供了一个机制，它先在本对象里找，如果没有会去prototype里去找，如果没有会去父类的prototype里去找，所以原型可以用于继承机制

原型比闭包的优点：第一是垃圾回收难，第二每次创建都会有一份新的函数逻辑

============================================================================================

html的标签和属性不区分大小写，但是对应到Js中必须全为小写，例如html中的onClick在js中必须为onclick

============================================================================================

output: alert(),document.write(),console.log(),element.innerHTML

如果当page完全加载完，再调用document.write()会先清空已存在的元素，所以它只能用来测试，

code一行最好在80字符内，一行装不下，最好的换行地方在运算符。

好的编程实践是1. 定义所有的变量名在代码开始处。

                      2.运算符的地方都应该有空格。

undefined即是value有是type

null的type是object,这个可以认为是javascript的bug， 这也应该是value是null,type也是null

============================================================================================

firefox拥有最快的解释器spridermonkey (2015 year).

============================================================================================

============================================================================================

DOM 文档对象模型（Document Object Model):

DOM就是一组API（接口）与 结构化文档。

并不是只有javascript有DOM API，其他的程序设计语言如java也有对应的DOM API。

DOM不是专为HTML结构化文档设计的，它是通用型的标准，为所有标记语言而设计。

DOM级别，有DOM0/1/2/3是指每次对接口与结构化文档制定的规范。其中就包括对事件的规范制定。

在DOM2上规定了事件流，即事件的传播顺序。将事件流分为三个阶段：捕获，目标，冒泡。

DOM0级事件处理程序规范：

<script> var btn= document .getElementById( "btn" ); btn.οnclick= function (){ alert( "hello" ); } </script>

缺点：1.不能绑定多个事件处理程序，2.不能控制处理程序是在捕获还是冒泡阶段执行。

DOM1级没有对事件做扩展制定。

DOM2级 事件处理程序规范：

btn.addEventListener( 'click' , fun, true );

1.可以为一个元素的一个事件添加多个处理程序。

2.第三个参数就是用来控制处理程序是在捕获阶段还是冒泡阶段执行。false为冒泡阶段执行，true为捕获阶段执行。

Event对象主要有以下两个方法 ：

stopPropagation() ——冒泡机制下，阻止事件的进一步往上冒泡

preventDefault() ——用于取消事件的默认操作,比如链接的跳转或者表单的提交

event.target 事件的目标节点

============================================================================================

闭包：

============================================================================================

============================================================================================

============================================================================================

============================================================================================

============================================================================================

============================================================================================

============================================================================================

============================================================================================

============================================================================================

============================================================================================

============================================================================================

============================================================================================

============================================================================================