## 对象的过程 描述new一个对象的过程 ①创建一个新对象 ``` var obj = new Object(); ``` ②让Person中的this指向obj，并执行Person的函数体 ``` var result = Person.call(obj); ``` ③执行代码，即对this赋值 ``` obj.__proto__ = Person.prototype; ``` ④返回this【判断Person的返回值类型，如果是值类型，返回obj。如果是引用类型，就返回这个引用类型的对象】 ``` if (typeof(result) == "object") person = result; else person = obj; ``` ***** ***** ## 原型 ①所有的引用类型(数组，对象，函数)，都具有对像特性，即可自由扩展属性（除了null） ②所有的引用类型(数组，对象，函数)，都有一个__proto__(隐式原型)属性，属性值也是一个普通对象 ③**所有的函数**，都有一个prototype(显式原型)属性，属性值也是一个普通对象 ④所有的引用类型(数组,对象，函数)，__proto__属性值指向它的构造函数的“prototype”属性值 ⑤当试图得到一个对象的某个属性时，如果这个对象本身没有这个属性，那么会去它的__proto__(即它的构造函数的prototype)中寻找 ***** ***** ## 同步和异步 ### 同步和异步的区别是什么？ ①同步会阻塞代码执行，而异步不会 ②alert是同步，setTimeout是异步 ### 何时需要异步 ①在可能发生等待的情况下 ②等待过程中不能像alert一样阻塞程序运行 ③因此，所以的”等待的情况”都需要异步 前端使用异步的场景 ①定时任务：setTimeout，setInterval ②网络请求：ajax请求，动态加载 ③事件绑定 ## 数组API ### forEach 遍历所有元素 ``` var arr=[1,2,3] arr.forEach(function(item,index){ //遍历数组的所有元素 console.log(index,item) }) ``` ### every 判断所有元素是否都符合条件 ``` var arr=[1,2,3] var result=arr.every(function(item,index){ //用来判断所有的数组元素，都满足一个条件 if(item<4){ return true; } }) console.log(result); ``` ### some 判断是否至少一个元素符合条件 ``` var arr=[1,2,3] var result=arr.some(function(item,index){ //用来判断所有的数组元素，只要有一个满足条件即可 if(item<2){ return true; } }) console.log(result); ``` ### sort 排序 ``` var arr=[1,4,2,3,5] var arr2=arr.sort(function(a,b){ //从小到大排序 return a-b //从大到小排序 //return b-a }) console.log(arr2) ``` ### map 对元素重新组装，生成新数组 ``` var arr=[1,2,3,4] var arr2=arr.map(function(item,index){ //将元素重新组装，并返回 return '<b>'+item+'</b>' }) console.log(arr2) ``` ### filter过滤符合条件的元素 ``` var arr=[1,2,3] var arr2=arr.filter(function(item,index){ //通过某一个条件过滤数组 if(item>=2){ return true; } }) console.log(arr2) ``` ### 判断是否在可视区域 ``` $(window).scroll(function () { var a = document.getElementById("eq").offsetTop; if (a >= $(window).scrollTop() && a < ($(window).scrollTop()+$(window).height())) { alert("div在可视范围"); } }); ``` ### 判断页面到底部 网页可见区域宽： document.body.clientWidth; 网页可见区域高： document.body.clientHeight; 网页可见区域宽： document.body.offsetWidth (包括边线的宽); 网页可见区域高： document.body.offsetHeight (包括边线的宽); 网页正文全文宽： document.body.scrollWidth; 网页正文全文高： document.body.scrollHeight; 网页被卷去的高： document.body.scrollTop; 网页被卷去的左： document.body.scrollLeft; 网页正文部分上： window.screenTop; 网页正文部分左： window.screenLeft; 屏幕分辨率的高： window.screen.height; 屏幕分辨率的宽： window.screen.width; 屏幕可用工作区高度： window.screen.availHeight; 屏幕可用工作区宽度：window.screen.availWidth; ``` scrollTop + clientHeight == scrollHeight。 ``` ``` $(window).scroll(function(){ 　　var scrollTop = $(this).scrollTop(); 　　var scrollHeight = $(document).height(); 　　var windowHeight = $(this).height(); 　　if(scrollTop + windowHeight == scrollHeight){ 　　　　alert("已经到最底部了！"); 　　} }); ``` /** * 函数节流方法 * @param Function fn 延时调用函数 * @param Number delay 延迟多长时间 * @return Function 延迟执行的方法 */ ``` var throttle = function (fn, delay) { var timer = null; return function () { clearTimeout(timer); timer = setTimeout(function() { fn(); }, delay); } }; window.onresize = throttle(testFn, 200, 1000);