前台开发总结06_20170520

1、JS中的 with(); 方法，用于设置代码在特定对象中的作用域。当在with()中调用方法或变量时，首先查询该对象的作用域中有无该方法或变量，若存在则输出，若不存在，则再查询全局作用域中有无该方法或变量。也即，with()会把一个对象插入到访问链的顶端。

eg. function animal(name,address){this.name=name;this.address=address;this.show=function(){document.write("这是show方法");};}var dog=new animal('dog','qingdao');with(dog){console.log(name);console.log(address);show();}

备注：with(){}; 可以优先访问对象中 this.property ，但是不能优先访问 局部变量，即var property ;
注意：在 "use strict"; 即严格模式时，因为限制动态绑定，只能静态绑定，因此with()是无法使用的。
动态绑定：某些属性和方法到底属于哪个对象，不是在编译时确定的，而是在运行时确定的。例如jQuery的 live()（注：live() W3C不推荐使用） 和 on() 方法。

$(selector).live('click',function(){……});

2、JS中Number类型的变量转换类型，使用Number.toString();如果想转换为2进制，参数为2；如果想转换为8进制，参数为8；如果转换为16进制，参数为16。
可以自己为Number添加一个类型转换方法

eg. Number.prototype.changeType=function(){return this.toString(16);}var number=15;console.log(number.changeType());

3、JS中的函数其实是对象，函数名是对Function对象的引用。JS中一切皆为对象。(重点)


4、backface-visibility定义当元素不面向屏幕时，元素是否可见 (CSS3属性值，注意兼容性)
属性值：
visible 背面是可见的
hidden 背面是不可见的


5、使用惰性函数可提高JS性能，减少不必要的计算，惰性函数包括但不限于对函数的重写，使用立即执行函数。
惰性函数的应用场景：
一、应用频繁，如果只用一次，是体现不出它的优点出来的，用的次数越多，越能体现这种模式的优势所在；
二、固定不变，一次判定，在固定的应用环境中不会发生改变；

三、复杂的分支判断，没有差异性，不需要应用这种模式；

可参考：http://blog.csdn.net/xiaobianjava/article/details/50617896

解析：对函数的重写只执行一次的原因

函数被重写后，原来的结构体遭到破坏，因此不会再次判断。

6、在HTML中，通过优化JS，提高页面渲染速度，方法如下：
一、将多个<script>中的内容合并为一个<script>，可以提高页面的渲染速度。因为多个<script>加载之间还有请求时间。
加载4个25K的JS文件的速度要大于加载一个100K的JS文件的速度。
二、可以配置<script>元素中的属性 async:true; 将其设置为异步加载，从而加快页面渲染速度，提高用户体验。
三、动态创建元素，加载JS，示例如下所示：

var script=document.createElement('script');script.type="text/javascript";script.src="test.js";document.getElementsByTagName('head')[0].appendChild(script);

备注：动态加载JS代码，可以使用相关的脚本，如 lazyload


7、列举一下js获取HTML元素。

一、document.getElementById();二、document.getElementsByName();      //获取HTML中name为指定值的元素，返回为数组三、document.getElementsByTagName();   //获取HTML中指定值的元素，返回为数组四、document.getElementsByClassName(); //获取HTML中class为指定值的元素，返回为数组

注意：getElementsByClassName()在 Internet Explorer 5,6,7,8 中无效。


8、JS引擎在查找变量时，会按照 scope chain 作用域链的顺序进行查找;深度越深，速度越慢;局部变量>全局变量。
Chrome和Salary的JS引擎是采用Hash表来存取数据的，Hash表有索引，访问时，数据位置、数据深度对访问速度没有影响。
但是，采用Hash表来存取数据，虽然提高了数据访问的速度，但是CPU的使用率却会提高。


9、嵌入对象的速度：location.href > window.location.href > window.location.href.toString()