javascript常见问题


为什么Vue3.0 采用了 Proxy,抛弃了 Object.defineProperty

  1. Object.defineProperty 无法低耗费的监听到数组下标的变化,导致通过数组下标添加元素,不能实时响应;
  2. Object.defineProperty 只能劫持对象的属性,从而需要对每个对象,每个属性进行遍历。如果属性值是对象,还需要深度遍历。 Proxy 可以劫持整个对象, 并返回一个新的对象。
  3. Proxy 不仅可以代理对象,还可以代理数组。还可以代理动态增加的属性。


写 React / Vue 项目时为什么要在列表组件中写 key

vue 和 react 都是采用 diff 算法来对比新旧虚拟节点,从而更新节点。在 vue 的 diff 函数交叉对比中,当新节点跟旧节点头尾交叉对比没有结果时,会根据新节点的 key 去对比旧节点数组中的 key,从而找到相应旧节点。如果没有找到就认为是一个新增节点。而如果没有 key,那么就会采用遍历查找的方式去找到对应的旧节点。


Set、Map、WeakSet 、WeakMap 区别

Set:元素不能重复,可以遍历,常用方法有 add、delete、has

WeakSet:元素都是对象(引用)、元素都是弱引用,随时可以消失(不计入垃圾回收机制);可以用来保存 DOM 节点,不容易造成内存泄露;不能遍历,常用方法有 add、delete、has

Map:存储键值,可以遍历,方法很多,可以跟各种数据格式转换;

WeakMap:只能使用对象作为键(null 除外),不能使用其他类型的值作为键;键指向的对象,不计入垃圾回收机制;不能遍历,常用方法同 get、set、has、delete


ES5和ES6中继承的区别

  1. class 声明会提升,但不会初始化赋值。(类似于 let、const 声明变量;
  2. class 声明内部会启用严格模式;
  3. class 的所有方法(包括静态方法和实例方法)都是不可枚举的;
  4. class 的所有方法(包括静态方法和实例方法)都没有原型对象 prototype,所以也没有 [[constructor]],不能使用 new 来调用;
  5. 必须使用 new 来调用 class
  6. class 内部无法重写类名;


setTimeout、Promise、Async/Await 的区别

setTimeout: setTimeout 的回调函数放到宏任务队列里,等到执行栈清空以后执行;

Promise: Promise 本身是同步的立即执行函数,当在 executor 中执行 resolve 或者 reject 的时候,此时是异步操作,会先执行 then/catch 等,当主栈完成时,才会去调用 resolve/reject 方法中存放的方法。

async: async 函数返回一个 Promise 对象,当函数执行的时候,一旦遇到 await 就会先返回,等到触发的异步操作完成,再执行函数体内后面的语句。可以理解为,是让出了线程,跳出了 async 函数体。


Async/Await 如何通过同步的方式实现异步

Async/Await 是一个自执行的 generate 函数。利用 generate 函数的特性把异步的代码写成“同步”的形式。

var fetch = require("node-fetch");

function* gen() { // 这里的 * 可以看成 async
  var url = "https://api.github.com/users/github";
  var result = yield fetch(url); // 这里的 yield 可以看成 await
  console.log(result.bio);
}

var g = gen();
var result = g.next();
result.value.then(data => data.json()).then(data  => g.next(data));


onmouseup和addEventListener的区别

1>. onmouseup只能指定一个监听,若多次指定监听,仅最后一次有效;

2>. addEventListener可添加多个监听,若要避免重复添加监听,可使用removeEventListener清除指定监听;




待续:https://segmentfault.com/a/1190000021966814




举报

© 著作权归作者所有


0