前端一面常见面试题及答案

作者：coder2028

2023-02-27
浙江
本文字数：10244 字
阅读完需：约 34 分钟

网络劫持有哪几种，如何防范？

⽹络劫持分为两种:

（1）DNS 劫持: (输⼊京东被强制跳转到淘宝这就属于 dns 劫持)

DNS 强制解析: 通过修改运营商的本地 DNS 记录，来引导⽤户流量到缓存服务器
302 跳转的⽅式: 通过监控⽹络出⼝的流量，分析判断哪些内容是可以进⾏劫持处理的,再对劫持的内存发起 302 跳转的回复，引导⽤户获取内容

（2）HTTP 劫持: (访问⾕歌但是⼀直有贪玩蓝⽉的⼴告),由于 http 明⽂传输,运营商会修改你的 http 响应内容(即加⼴告)

DNS 劫持由于涉嫌违法，已经被监管起来，现在很少会有 DNS 劫持，⽽http 劫持依然⾮常盛⾏，最有效的办法就是全站 HTTPS，将 HTTP 加密，这使得运营商⽆法获取明⽂，就⽆法劫持你的响应内容。

寄生组合继承

题目描述:实现一个你认为不错的 js 继承方式

实现代码如下:

function Parent(name) {  this.name = name;  this.say = () => {    console.log(111);  };}Parent.prototype.play = () => {  console.log(222);};function Children(name) {  Parent.call(this);  this.name = name;}Children.prototype = Object.create(Parent.prototype);Children.prototype.constructor = Children;// let child = new Children("111");// // console.log(child.name);// // child.say();// // child.play();

复制代码

节流与防抖

函数防抖是指在事件被触发 n 秒后再执行回调，如果在这 n 秒内事件又被触发，则重新计时。这可以使用在一些点击请求的事件上，避免因为用户的多次点击向后端发送多次请求。
函数节流是指规定一个单位时间，在这个单位时间内，只能有一次触发事件的回调函数执行，如果在同一个单位时间内某事件被触发多次，只有一次能生效。节流可以使用在 scroll 函数的事件监听上，通过事件节流来降低事件调用的频率。

// 函数防抖的实现function debounce(fn, wait) {  var timer = null;
  return function() {    var context = this,      args = arguments;
    // 如果此时存在定时器的话，则取消之前的定时器重新记时    if (timer) {      clearTimeout(timer);      timer = null;    }
    // 设置定时器，使事件间隔指定事件后执行    timer = setTimeout(() => {      fn.apply(context, args);    }, wait);  };}
// 函数节流的实现;function throttle(fn, delay) {  var preTime = Date.now();
  return function() {    var context = this,      args = arguments,      nowTime = Date.now();
    // 如果两次时间间隔超过了指定时间，则执行函数。    if (nowTime - preTime >= delay) {      preTime = Date.now();      return fn.apply(context, args);    }  };}

复制代码

异步任务调度器

描述：实现一个带并发限制的异步调度器 Scheduler，保证同时运行的任务最多有 limit 个。

实现：

class Scheduler {    queue = [];  // 用队列保存正在执行的任务    runCount = 0;  // 计数正在执行的任务个数    constructor(limit) {        this.maxCount = limit;  // 允许并发的最大个数    }    add(time, data){        const promiseCreator = () => {            return new Promise((resolve, reject) => {                setTimeout(() => {                    console.log(data);                    resolve();                }, time);            });        }        this.queue.push(promiseCreator);        // 每次添加的时候都会尝试去执行任务        this.request();    }    request() {        // 队列中还有任务才会被执行        if(this.queue.length && this.runCount < this.maxCount) {            this.runCount++;            // 执行先加入队列的函数            this.queue.shift()().then(() => {                this.runCount--;                // 尝试进行下一次任务                this.request();            });        }    }}
// 测试const scheduler = new Scheduler(2);const addTask = (time, data) => {    scheduler.add(time, data);}
addTask(1000, '1');addTask(500, '2');addTask(300, '3');addTask(400, '4');// 输出结果 2 3 1 4

复制代码

写代码：实现函数能够深度克隆基本类型

浅克隆：

function shallowClone(obj) {  let cloneObj = {};
  for (let i in obj) {    cloneObj[i] = obj[i];  }
  return cloneObj;}

复制代码

深克隆：

考虑基础类型
引用类型
RegExp、Date、函数不是 JSON 安全的
会丢失 constructor，所有的构造函数都指向 Object
破解循环引用

function deepCopy(obj) {  if (typeof obj === 'object') {    var result = obj.constructor === Array ? [] : {};
    for (var i in obj) {      result[i] = typeof obj[i] === 'object' ? deepCopy(obj[i]) : obj[i];    }  } else {    var result = obj;  }
  return result;}

复制代码

代码输出结果

function runAsync (x) {  const p = new Promise(r => setTimeout(() => r(x, console.log(x)), 1000))  return p}Promise.race([runAsync(1), runAsync(2), runAsync(3)])  .then(res => console.log('result: ', res))  .catch(err => console.log(err))

复制代码

输出结果如下：

1'result: ' 123

复制代码

then 只会捕获第一个成功的方法，其他的函数虽然还会继续执行，但是不是被 then 捕获了。

参考前端进阶面试题详细解答

Cookie、LocalStorage、SessionStorage 区别

浏览器端常用的存储技术是 cookie 、localStorage 和 sessionStorage。

cookie： 其实最开始是服务器端用于记录用户状态的一种方式，由服务器设置，在客户端存储，然后每次发起同源请求时，发送给服务器端。cookie 最多能存储 4 k 数据，它的生存时间由 expires 属性指定，并且 cookie 只能被同源的页面访问共享。
sessionStorage： html5 提供的一种浏览器本地存储的方法，它借鉴了服务器端 session 的概念，代表的是一次会话中所保存的数据。它一般能够存储 5M 或者更大的数据，它在当前窗口关闭后就失效了，并且 sessionStorage 只能被同一个窗口的同源页面所访问共享。
localStorage： html5 提供的一种浏览器本地存储的方法，它一般也能够存储 5M 或者更大的数据。它和 sessionStorage 不同的是，除非手动删除它，否则它不会失效，并且 localStorage 也只能被同源页面所访问共享。

上面几种方式都是存储少量数据的时候的存储方式，当需要在本地存储大量数据的时候，我们可以使用浏览器的 indexDB 这是浏览器提供的一种本地的数据库存储机制。它不是关系型数据库，它内部采用对象仓库的形式存储数据，它更接近 NoSQL 数据库。

点击刷新按钮或者按 F5、按 Ctrl+F5 （强制刷新）、地址栏回车有什么区别？

点击刷新按钮或者按 F5： 浏览器直接对本地的缓存文件过期，但是会带上 If-Modifed-Since，If-None-Match，这就意味着服务器会对文件检查新鲜度，返回结果可能是 304，也有可能是 200。
用户按 Ctrl+F5（强制刷新）： 浏览器不仅会对本地文件过期，而且不会带上 If-Modifed-Since，If-None-Match，相当于之前从来没有请求过，返回结果是 200。
地址栏回车：浏览器发起请求，按照正常流程，本地检查是否过期，然后服务器检查新鲜度，最后返回内容。

Cookie 有哪些字段，作用分别是什么

Cookie 由以下字段组成：

Name：cookie 的名称
Value：cookie 的值，对于认证 cookie，value 值包括 web 服务器所提供的访问令牌；
Size： cookie 的大小
Path：可以访问此 cookie 的页面路径。比如 domain 是 abc.com，path 是/test，那么只有/test路径下的页面可以读取此 cookie。
Secure：指定是否使用 HTTPS 安全协议发送 Cookie。使用 HTTPS 安全协议，可以保护 Cookie 在浏览器和 Web 服务器间的传输过程中不被窃取和篡改。该方法也可用于 Web 站点的身份鉴别，即在 HTTPS 的连接建立阶段，浏览器会检查 Web 网站的 SSL 证书的有效性。但是基于兼容性的原因（比如有些网站使用自签署的证书）在检测到 SSL 证书无效时，浏览器并不会立即终止用户的连接请求，而是显示安全风险信息，用户仍可以选择继续访问该站点。
Domain：可以访问该 cookie 的域名，Cookie 机制并未遵循严格的同源策略，允许一个子域可以设置或获取其父域的 Cookie。当需要实现单点登录方案时，Cookie 的上述特性非常有用，然而也增加了 Cookie 受攻击的危险，比如攻击者可以借此发动会话定置攻击。因而，浏览器禁止在 Domain 属性中设置.org、.com 等通用顶级域名、以及在国家及地区顶级域下注册的二级域名，以减小攻击发生的范围。
HTTP：该字段包含HTTPOnly 属性，该属性用来设置 cookie 能否通过脚本来访问，默认为空，即可以通过脚本访问。在客户端是不能通过 js 代码去设置一个 httpOnly 类型的 cookie 的，这种类型的 cookie 只能通过服务端来设置。该属性用于防止客户端脚本通过document.cookie属性访问 Cookie，有助于保护 Cookie 不被跨站脚本攻击窃取或篡改。但是，HTTPOnly 的应用仍存在局限性，一些浏览器可以阻止客户端脚本对 Cookie 的读操作，但允许写操作；此外大多数浏览器仍允许通过 XMLHTTP 对象读取 HTTP 响应中的 Set-Cookie 头。
Expires/Max-size ：此 cookie 的超时时间。若设置其值为一个时间，那么当到达此时间后，此 cookie 失效。不设置的话默认值是 Session，意思是 cookie 会和 session 一起失效。当浏览器关闭(不是浏览器标签页，而是整个浏览器) 后，此 cookie 失效。

总结： 服务器端可以使用 Set-Cookie 的响应头部来配置 cookie 信息。一条 cookie 包括了 5 个属性值 expires、domain、path、secure、HttpOnly。其中 expires 指定了 cookie 失效的时间，domain 是域名、path 是路径，domain 和 path 一起限制了 cookie 能够被哪些 url 访问。secure 规定了 cookie 只能在确保安全的情况下传输，HttpOnly 规定了这个 cookie 只能被服务器访问，不能使用 js 脚本访问。

单例模式

意图：保证一个类仅有一个实例，并提供一个访问它的全局访问点。

主要解决：一个全局使用的类频繁地创建与销毁。

何时使用：当您想控制实例数目，节省系统资源的时候。

如何解决：判断系统是否已经有这个单例，如果有则返回，如果没有则创建。

实现：

var Singleton = (function() {    // 如果在内部声明 SingletonClass 对象，则无法在外部直接调用    var SingletonClass = function() { };     var instance;    return function() {        // 如果已存在，则返回 instance        if(instance) return instance;        // 如果不存在，则new 一个 SingletonClass 对象        instance = new SingletonClass();        return instance;    }})();
// 测试var a = new Singleton();var b = new Singleton();console.log(a === b);  // true

复制代码

原型

构造函数是一种特殊的方法，主要用来在创建对象时初始化对象。每个构造函数都有prototype(原型)(箭头函数以及Function.prototype.bind()没有)属性，这个prototype(原型)属性是一个指针，指向一个对象，这个对象的用途是包含特定类型的所有实例共享的属性和方法，即这个原型对象是用来给实例对象共享属性和方法的。每个实例对象的__proto__都指向这个构造函数/类的prototype属性。
面向对象的三大特性：继承/多态/封装
关于new操作符：
1. new执行的函数, 函数内部默认生成了一个对象
2. 函数内部的this默认指向了这个new生成的对象
3. new执行函数生成的这个对象, 是函数的默认返回值
ES5例子：function Person(obj) {    this.name = obj.name    this.age= obj.age}// 原型方法Person.prototype.say = function() {  console.log('你好,', this.name )}// p为实例化对象，new Person()这个操作称为构造函数的实例化let p = new Person({name: '番茄', age: '27'})console.log(p.name, p.age)p.say()
ES6例子：class Person{    constructor(obj) {      this.name = obj.name        this.age= obj.age  }  say() {      console.log(this.name)  }}
let p = new Person({name: 'ES6-番茄', age: '27'})console.log(p.name, p.age)p.say()

复制代码

代码输出结果

const async1 = async () => {  console.log('async1');  setTimeout(() => {    console.log('timer1')  }, 2000)  await new Promise(resolve => {    console.log('promise1')  })  console.log('async1 end')  return 'async1 success'} console.log('script start');async1().then(res => console.log(res));console.log('script end');Promise.resolve(1)  .then(2)  .then(Promise.resolve(3))  .catch(4)  .then(res => console.log(res))setTimeout(() => {  console.log('timer2')}, 1000)

复制代码

输出结果如下：

script startasync1promise1script end1timer2timer1

复制代码

代码的执行过程如下：

首先执行同步带吗，打印出 script start；
遇到定时器 timer1 将其加入宏任务队列；
之后是执行 Promise，打印出 promise1，由于 Promise 没有返回值，所以后面的代码不会执行；
然后执行同步代码，打印出 script end；
继续执行下面的 Promise，.then 和.catch 期望参数是一个函数，这里传入的是一个数字，因此就会发生值渗透，将 resolve(1)的值传到最后一个 then，直接打印出 1；
遇到第二个定时器，将其加入到微任务队列，执行微任务队列，按顺序依次执行两个定时器，但是由于定时器时间的原因，会在两秒后先打印出 timer2，在四秒后打印出 timer1。

代码输出结果

console.log('1');
setTimeout(function() {    console.log('2');    process.nextTick(function() {        console.log('3');    })    new Promise(function(resolve) {        console.log('4');        resolve();    }).then(function() {        console.log('5')    })})process.nextTick(function() {    console.log('6');})new Promise(function(resolve) {    console.log('7');    resolve();}).then(function() {    console.log('8')})
setTimeout(function() {    console.log('9');    process.nextTick(function() {        console.log('10');    })    new Promise(function(resolve) {        console.log('11');        resolve();    }).then(function() {        console.log('12')    })})

复制代码

输出结果如下：

176824359111012

复制代码

（1）第一轮事件循环流程分析如下：

整体 script 作为第一个宏任务进入主线程，遇到console.log，输出 1。
遇到setTimeout，其回调函数被分发到宏任务 Event Queue 中。暂且记为setTimeout1。
遇到process.nextTick()，其回调函数被分发到微任务 Event Queue 中。记为process1。
遇到Promise，new Promise直接执行，输出 7。then被分发到微任务 Event Queue 中。记为then1。
又遇到了setTimeout，其回调函数被分发到宏任务 Event Queue 中，记为setTimeout2。

上表是第一轮事件循环宏任务结束时各 Event Queue 的情况，此时已经输出了 1 和 7。发现了process1和then1两个微任务：

执行process1，输出 6。
执行then1，输出 8。

第一轮事件循环正式结束，这一轮的结果是输出 1，7，6，8。

（2）第二轮时间循环从**setTimeout1**宏任务开始：

首先输出 2。接下来遇到了process.nextTick()，同样将其分发到微任务 Event Queue 中，记为process2。
new Promise立即执行输出 4，then也分发到微任务 Event Queue 中，记为then2。

第二轮事件循环宏任务结束，发现有process2和then2两个微任务可以执行：

输出 3。
输出 5。

第二轮事件循环结束，第二轮输出 2，4，3，5。

（3）第三轮事件循环开始，此时只剩 setTimeout2 了，执行。

直接输出 9。
将process.nextTick()分发到微任务 Event Queue 中。记为process3。
直接执行new Promise，输出 11。
将then分发到微任务 Event Queue 中，记为then3。

第三轮事件循环宏任务执行结束，执行两个微任务process3和then3：

输出 10。
输出 12。

第三轮事件循环结束，第三轮输出 9，11，10，12。

整段代码，共进行了三次事件循环，完整的输出为 1，7，6，8，2，4，3，5，9，11，10，12。

代码输出问题

window.number = 2;var obj = { number: 3, db1: (function(){   console.log(this);   this.number *= 4;   return function(){     console.log(this);     this.number *= 5;   } })()}var db1 = obj.db1;db1();obj.db1();console.log(obj.number);     // 15console.log(window.number);  // 40

复制代码

这道题目看清起来有点乱，但是实际上是考察 this 指向的:

执行 db1()时，this 指向全局作用域，所以 window.number * 4 = 8，然后执行匿名函数，所以 window.number * 5 = 40；
执行 obj.db1();时，this 指向 obj 对象，执行匿名函数，所以 obj.numer * 5 = 15。

僵尸进程和孤儿进程是什么？

孤儿进程：父进程退出了，而它的一个或多个进程还在运行，那这些子进程都会成为孤儿进程。孤儿进程将被 init 进程(进程号为 1)所收养，并由 init 进程对它们完成状态收集工作。
僵尸进程：子进程比父进程先结束，而父进程又没有释放子进程占用的资源，那么子进程的进程描述符仍然保存在系统中，这种进程称之为僵死进程。

手写题：Promise 原理

class MyPromise {  constructor(fn) {    this.callbacks = [];    this.state = "PENDING";    this.value = null;
    fn(this._resolve.bind(this), this._reject.bind(this));  }
  then(onFulfilled, onRejected) {    return new MyPromise((resolve, reject) =>      this._handle({        onFulfilled: onFulfilled || null,        onRejected: onRejected || null,        resolve,        reject,      })    );  }
  catch(onRejected) {    return this.then(null, onRejected);  }
  _handle(callback) {    if (this.state === "PENDING") {      this.callbacks.push(callback);
      return;    }
    let cb =      this.state === "FULFILLED" ? callback.onFulfilled : callback.onRejected;    if (!cb) {      cb = this.state === "FULFILLED" ? callback.resolve : callback.reject;      cb(this.value);
      return;    }
    let ret;
    try {      ret = cb(this.value);      cb = this.state === "FULFILLED" ? callback.resolve : callback.reject;    } catch (error) {      ret = error;      cb = callback.reject;    } finally {      cb(ret);    }  }
  _resolve(value) {    if (value && (typeof value === "object" || typeof value === "function")) {      let then = value.then;
      if (typeof then === "function") {        then.call(value, this._resolve.bind(this), this._reject.bind(this));
        return;      }    }
    this.state === "FULFILLED";    this.value = value;    this.callbacks.forEach((fn) => this._handle(fn));  }
  _reject(error) {    this.state === "REJECTED";    this.value = error;    this.callbacks.forEach((fn) => this._handle(fn));  }}
const p1 = new Promise(function (resolve, reject) {  setTimeout(() => reject(new Error("fail")), 3000);});
const p2 = new Promise(function (resolve, reject) {  setTimeout(() => resolve(p1), 1000);});
p2.then((result) => console.log(result)).catch((error) => console.log(error));

复制代码

script 标签中 defer 和 async 的区别

如果没有 defer 或 async 属性，浏览器会立即加载并执行相应的脚本。它不会等待后续加载的文档元素，读取到就会开始加载和执行，这样就阻塞了后续文档的加载。

defer 和 async 属性都是去异步加载外部的 JS 脚本文件，它们都不会阻塞页面的解析，其区别如下：

执行顺序： 多个带 async 属性的标签，不能保证加载的顺序；多个带 defer 属性的标签，按照加载顺序执行；
脚本是否并行执行：async 属性，表示后续文档的加载和执行与 js 脚本的加载和执行是并行进行的，即异步执行；defer 属性，加载后续文档的过程和 js 脚本的加载(此时仅加载不执行)是并行进行的(异步)，js 脚本需要等到文档所有元素解析完成之后才执行，DOMContentLoaded 事件触发执行之前。

陈述 http

基本概念：
HTTP，全称为 HyperText Transfer Protocol，即为超文本传输协议。是互联网应用最为广泛的一种网络协议所有的 www 文件都必须遵守这个标准。
http特性：
HTTP 是无连接无状态的HTTP 一般构建于 TCP/IP 协议之上，默认端口号是 80HTTP 可以分为两个部分，即请求和响应。
http请求：
HTTP 定义了在与服务器交互的不同方式，最常用的方法有 4 种分别是 GET，POST，PUT， DELETE。URL 全称为资源描述符，可以这么认为：一个 URL 地址对应着一个网络上的资源，而 HTTP 中的 GET，POST，PUT，DELETE 就对应着对这个资源的查询，修改，增添，删除4个操作。
HTTP 请求由 3 个部分构成，分别是：状态行，请求头(Request Header)，请求正文。
HTTP 响应由 3 个部分构成，分别是：状态行，响应头(Response Header)，响应正文。
HTTP 响应中包含一个状态码，用来表示服务器对客户端响应的结果。状态码一般由3位构成：
1xx : 表示请求已经接受了，继续处理。2xx : 表示请求已经处理掉了。3xx : 重定向。4xx : 一般表示客户端有错误，请求无法实现。5xx : 一般为服务器端的错误。
比如常见的状态码：
200 OK 客户端请求成功。301 Moved Permanently 请求永久重定向。302 Moved Temporarily 请求临时重定向。304 Not Modified 文件未修改，可以直接使用缓存的文件。400 Bad Request 由于客户端请求有语法错误，不能被服务器所理解。401 Unauthorized 请求未经授权，无法访问。403 Forbidden 服务器收到请求，但是拒绝提供服务。服务器通常会在响应正文中给出不提供服务的原因。404 Not Found 请求的资源不存在，比如输入了错误的URL。500 Internal Server Error 服务器发生不可预期的错误，导致无法完成客户端的请求。503 Service Unavailable 服务器当前不能够处理客户端的请求，在一段时间之后，服务器可能会恢复正常。
大概还有一些关于http请求和响应头信息的介绍。

复制代码

代码输出结果

function a() {  console.log(this);}a.call(null);

复制代码

打印结果：window 对象

根据 ECMAScript262 规范规定：如果第一个参数传入的对象调用者是 null 或者 undefined，call 方法将把全局对象（浏览器上是 window 对象）作为 this 的值。所以，不管传入 null 还是 undefined，其 this 都是全局对象 window。所以，在浏览器上答案是输出 window 对象。

要注意的是，在严格模式中，null 就是 null，undefined 就是 undefined：

'use strict';
function a() {    console.log(this);}a.call(null); // nulla.call(undefined); // undefined

复制代码

对 requestAnimationframe 的理解

实现动画效果的方法比较多，Javascript 中可以通过定时器 setTimeout 来实现，CSS3 中可以使用 transition 和 animation 来实现，HTML5 中的 canvas 也可以实现。除此之外，HTML5 提供一个专门用于请求动画的 API，那就是 requestAnimationFrame，顾名思义就是请求动画帧。

MDN 对该方法的描述：

window.requestAnimationFrame() 告诉浏览器——你希望执行一个动画，并且要求浏览器在下次重绘之前调用指定的回调函数更新动画。该方法需要传入一个回调函数作为参数，该回调函数会在浏览器下一次重绘之前执行。

语法： window.requestAnimationFrame(callback); 其中，callback 是下一次重绘之前更新动画帧所调用的函数(即上面所说的回调函数)。该回调函数会被传入 DOMHighResTimeStamp 参数，它表示 requestAnimationFrame() 开始去执行回调函数的时刻。该方法属于宏任务，所以会在执行完微任务之后再去执行。

取消动画： 使用 cancelAnimationFrame()来取消执行动画，该方法接收一个参数——requestAnimationFrame 默认返回的 id，只需要传入这个 id 就可以取消动画了。

优势：

CPU 节能：使用 SetTinterval 实现的动画，当页面被隐藏或最小化时，SetTinterval 仍然在后台执行动画任务，由于此时页面处于不可见或不可用状态，刷新动画是没有意义的，完全是浪费 CPU 资源。而 RequestAnimationFrame 则完全不同，当页面处理未激活的状态下，该页面的屏幕刷新任务也会被系统暂停，因此跟着系统走的 RequestAnimationFrame 也会停止渲染，当页面被激活时，动画就从上次停留的地方继续执行，有效节省了 CPU 开销。
函数节流：在高频率事件( resize, scroll 等)中，为了防止在一个刷新间隔内发生多次函数执行，RequestAnimationFrame 可保证每个刷新间隔内，函数只被执行一次，这样既能保证流畅性，也能更好的节省函数执行的开销，一个刷新间隔内函数执行多次时没有意义的，因为多数显示器每 16.7ms 刷新一次，多次绘制并不会在屏幕上体现出来。
减少 DOM 操作：requestAnimationFrame 会把每一帧中的所有 DOM 操作集中起来，在一次重绘或回流中就完成，并且重绘或回流的时间间隔紧紧跟随浏览器的刷新频率，一般来说，这个频率为每秒 60 帧。

setTimeout 执行动画的缺点：它通过设定间隔时间来不断改变图像位置，达到动画效果。但是容易出现卡顿、抖动的现象；原因是：

settimeout 任务被放入异步队列，只有当主线程任务执行完后才会执行队列中的任务，因此实际执行时间总是比设定时间要晚；
settimeout 的固定时间间隔不一定与屏幕刷新间隔时间相同，会引起丢帧。

发布于: 13 分钟前阅读数: 6

coder2028

关注

还未添加个人签名 2022-09-08 加入

还未添加个人简介

发布

暂无评论

创作场景

前端一面常见面试题及答案

网络劫持有哪几种，如何防范？

寄生组合继承

节流与防抖

异步任务调度器

写代码：实现函数能够深度克隆基本类型

代码输出结果

Cookie、LocalStorage、SessionStorage 区别

点击刷新按钮或者按 F5、按 Ctrl+F5 （强制刷新）、地址栏回车有什么区别？

Cookie 有哪些字段，作用分别是什么

单例模式

原型

代码输出结果

代码输出结果

代码输出问题

僵尸进程和孤儿进程是什么？

手写题：Promise 原理

script 标签中 defer 和 async 的区别

陈述 http

代码输出结果

对 requestAnimationframe 的理解

coder2028

评论