前端基础知识整理

setTimeout(() => {task()
},3000)

sleep(10000000)

过程：

task() 进入 Event Table 并注册, 计时开始。
执行 sleep 函数，很慢，非常慢，计时仍在继续。
3 秒到了，计时事件 timeout 完成，task() 进入 Event Queue，但是 sleep 也太慢了吧，还没执行完，只好等着。
sleep 终于执行完了，task() 终于从 Event Queue 进入了主线程执行。

通过将事件绑定在父级 dom 上来减少事件对象占用内存，然后在父级事件中用 traget 来指向子容器节点。（就是把 click 事件绑在 ul 上，再根据 li 的属性，实现不同的 li 点击效果）

由于 src 请求是可以跨域的，那么可以使用 srcipt 来请求后端提供的 json 来获取 data，同时告诉后端回调事件的名字，用回调函数名称包裹返回数据，这样，返回数据就作为回调函数的参数传回去了，在前端 js 可以执行对应的 callback

简单理解是启动 node 服务，将组件或页面通过服务器生成 html 字符串，再发送到浏览器，访问路由的时候直接获取到 html
angular9 脚手架带 ssr https://github.com/Ismaestro/…
参数详解 https://www.cnblogs.com/laixi…

提前加载，提前请求数据

提前加载 webview 并隐藏，消耗内存，切换 webview 时需要清除浏览痕迹，造成内存泄漏
设置 webview 缓冲池，从缓冲池中加载，不用时销毁，消耗更大内存，但不用清除浏览痕迹。
客户端 app 帮忙请求一些数据，减少 webview 内存消耗

实例的__proto__指向它构造函数的 prototype（原型对象），每个对象都有原型对象（_proto_），原型对象的_proto_，依次向上，最后指向 null，null 没有原型，是原型链的最后一节
Object.create() 相当于 calss 中的 extend 继承。a=Object.create(b) 表示 a 继承了 b 的属性。
访问一个对象 var aa = {key: 123} 的某个属性 key，查询顺序为： aa=> aa._proto_ = Object.prototype

函数，数组都是对象的实例，原型都是 Object

// 例如：（数组都继承于 Array.prototype）var bb = [1,2,3]
bb.__proto__ === Array.prototype // true
Array.prototype.__proto__ == Object.prototype // true
Object.prototype.__proto__ === null // true

this 永远指向的是一个对象；
this 的指向完全取决于函数调用的位置；

函数调用的时候，this 将永久的绑定在调用的位置上。

var o = {
  prop: 33,
  f: function() {return this.prop;}
};
// 执行
window.f = o.f; // 此时 window.f 中的 this 绑定在了 window 上，o.f 中的 this 绑定在了 o 上；var aa = 55;
window.f() // 55
o.f() // 33

apply 和 call 可以修改 this 的指向

call，apply 都属于 Function.prototype 的一个方法

 // 简单理解 apply，call 和 bind
 A.call(B) // 等同于 B 可以继承 A 的属性

 var aa = {key: 123}
 function fu (){return this}
 
 fu.call(aa)  // 即使用 aa 去执行 return this，那么得到 {key : 123}
 fu.apply(aa) // {key : 123}
 
 // 注意：箭头函数不能使用 call 和 apply 来改变 this 的指向
 var fu2 = ()=>{return this;}
 
 fu2.call(aa) // window
 
 // 使用 bind 会创建一个与原函数相同函数体和作用域的函数
 // 并且 this 将永久地绑定在 bind 的第一个参数，后面不管如何调用都不会改变 this 的指向
 var gg = fu.bind({key:"111"})
 gg() // {key:"111"}
 gg.bind({key:"222"})
 gg() // {key:"111"}

箭头函数的 this：this 始终指向它被创建时所处的词法作用域中的 this，并且不会被修改

var obj = {fu1: ()=>{console.log(this)
    },
    fu2: function(){console.log(this)
    }
}

obj.fu1() // window
obj.fu2() // obj

// 闭包
var obj = {arrowFn: function(){return ()=>{console.log(this);    
        }
    }
}

var fun = obj.arrowFn()  // 将 return 的箭头函数赋值给 fun

fun() // obj

前端基础知识整理

理解 settimeout 的定义

事件委托

jsonp

ssr 服务端渲染

webview 优化

原型链

this 的指向