今日份前端小结

170 阅读3分钟

V8部分:

  1. 用TurboFan逐渐取代CrankShaft,即时编译,TurboFan中优化更多,更复杂,更彻底,采用了分层架构便于后续实现优化和功能时能编写更有效的单元测试。
  2. v8使用即时编译执行代码,意味着执行代码之前需要对代码进行解析和编译,这会导致相当大的开销。Chrome在两天内看到相同脚本时会生产脚本缓存数据,并将缓存数据附加到源对象,并且可以检索和持久化(存储到硬盘),后续编译脚本时将从缓存数据中反序列化代码,缓存代码能提高约两倍速度。
  3. 垃圾收集,许多引擎包括V8都是动态分配用于应用程序运行的内存,确认那些数据不被使用后则会清除释放。垃圾回收机制是分新旧代的,通常大多数被清除的对象是属于新生代,清道夫可以在新生代内进行常规性的短时间回收,而不必在旧生代中追踪对象。新生代是半空间分配策略的,通常新对象最开始被放在一个半空间中,后续有新对象生成也是分配在该半空间中,直到该空间变满,而后会将该半空间的活动对象复制到到另一个半空间中,如果这些对象多次回收仍然存在则升为老一代,同时被认为是持久的,而未被移除的剩余死对象都会被清除。老生代则是判断是否被引用,如果没有其他引用则会被回收,并且采用增量标记得策略标记需要回收得对象(因为JS单线程,标记回收会影响主线程任务的执行),即在浏览器空闲的时候标记对象,直到标记完整个堆后执行回收。(v8 4.9版本并发回收)
  4. v84.9版本支持WebAssembly,是javascript的低级子集,旨在以紧凑的二进制格式进行编码,以接近本机的速度在安全的沙箱中运行。

    TurboFan:V8的优化编译器之一

ES6新特性:

     箭头函数:不会新生成this,既不会隐式绑定,便于回调,简化了代码,但同时不能被new 调用,因为没有this,如果用new操作符实例化一个箭头函数,则会报错 “is not a constructor”,即“非构造函数”。

     构造函数:**内部用this 来构造属性和方法,通常首字母大写区分于普通函数 **

**     Object.assign(target,source),会将source上的属性方法添加到target上,如果target上有重复的键值对,会被覆盖**

for...of 遍历value值,for...in遍历key(vue中v-for 推荐使用in遍历对象,of遍历数组,但因为array也是对象,所以可以通过in遍历 返回为 值,键)

     点差rest操作符(...)对象或者数组扁平化或者合并,可以代替arguments,也可以当作apply(null,...args)使用。

     在函数内可以使用new.target是否存在来判断当前执行方式是new调用还是普通调用。

     在使用Es6 继承时,超类中的new.target绑定到new调用的派生构造函数,这使得超类在构造过程中可以访问派生类的原型。

     Array.includes 来判断数组中是否包含某个值

     proxy和reflect  proxy可以做数据拦截,验证,包含对象,reflect用于给proxy返回合适的默认值。

const debugMe = new Proxy({}, {  
    get(target, name, receiver) {    
    console.log(`Debug: get called for field: ${name}`);    
    return Reflect.get(target, name, receiver); 
 }, 
     set(target, name, value, receiver) {  
          console.log(`Debug: set called for field: ${name}, and value: ${value}`);    
        return Reflect.set(target, name, value, receiver); 
    }});
debugMe.name = 'John Doe';// Debug: set called for field: name, and value: John Doe
const title = `Mr. ${debugMe.name}`; // → 'Mr. John Doe'// Debug: get called for field: name

let 块级作用域,const 指针不可变。

正则 : 后置断言(?<=)从右往左匹配,前置断言 (?=)从左往右,"=" 替换为 "!" 为非,\u匹配unicode,即表情。