2019前端中高级面试精华100题【一/js篇】(有答案)

以下问题大部分偏初中级,答案也都是简明扼要,可以在面试时应付一下,免得无点可说在第一面就被PASS。如果这些问题能让你快速回忆起平时所学,串联起前后的技能点,在面试时有个好的发挥,也就不费我整理这些面试题的用心。最后,这些答案仅供参考,不要死记硬背。愿你们都能找到满意的工作。

我是李古拉雷,曾全栈开发工程师,前今日头条前端架构师,今创业公司CEO。关注我的公众号可以获得更多前端技术和职场经验。我的人生信条分享即价值!

JS篇

目录

1.let、var、const区别?

2.什么是函数柯里化?

3.什么是Promise对象,有哪些用法?

4.如何通过Promise对象实现ajax?

5.什么是REST,用起来有什么好处?

6.什么是闭包,举个例子说明一下

7.promise、generator、async/await怎么使用,有什么区别?

8.apply/call/bind 有什么区别?

9.什么是变量提升、函数提升?

10.什么是事件冒泡,它是如何工作的?如何阻止事件冒泡

11.简单说说js中的继承

12.常用的js数组操作方法有哪些?

13.js数组去重,能用几种方法实现?

14.数组中的forEach和map的区别?

15.jQueryajax 、fetch、 axios 有什么异同,适用场景有哪些?

16.es6 扩展运算符可以解决哪些问题?

17.是么是js事件循环 event loop?

18.Math.min()和Math.max()大小比较?

19.怎么实现对象的深浅拷贝?

20.文件上传如何做断点续传?

21.js如何处理防抖和节流?

22.事件委托以及优缺点

23.介绍this各种情况

24.== 和 ===的区别,什么情况下用相等==

25.介绍下原型链(解决的是继承问题吗)

26.JS里垃圾回收机制是什么,常用的是哪种,怎么处理的?

27.Promise和setTimeout的区别?

28.介绍下广度优先遍历(BFS)和深度优先遍历(DFS)?

29.for in和for of的区别

30.typeof和instanceof 区别?

31.常见的继承有几种方法


1.let、var、const区别?

答:

1.var声明的变量会挂载在window上,而let和const声明的变量不会

2.var声明变量存在变量提升,let和const不存在变量提升

3.let和const声明形成块作用域,var变量提升不会形成作用域

4.同一作用域下let和const不能声明同名变量,而var可以

5.var和let可以可以修改声明的变量,const不可以

6.const定义的变量时必须初始化

7.let、const 存在暂时性死区

 

2.什么是函数柯里化?

答:属于高阶函数应用,传递给函数部分参数来调用柯里化函数,让它返回一个函数去处理剩下的参数。

// 把接受多个参数的函数转换成接受一个单一参数的函数

// 柯里化

var foo = function(x) {

return function(y) {

return x + y

}

}

foo(3)(4) // 7

// 普通方法

var add = function(x, y) {

return x + y;

}

add(3, 4) //7

3.什么是Promise对象,有哪些用法?

答:

Promise对象的定义

Promise是异步编程的一种解决方案,它是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果。从语法上说,Promise 是一个对象,从它可以获取异步操作的消息。可以用来解决“回调地狱”的问题。Promise 提供统一的 API,各种异步操作都可以用同样的方法进行处理。promise对象是一个构造函数,用来生成Promise实例;

Promise对象的特点

(1)对象的状态不受外界影响,promise对象代表一个异步操作,有三种状态,pending(进行中)、fulfilled(已成功)、rejected(已失败)。只有异步操作的结果,可以决定当前是哪一种状态,任何其他操作都无法改变这个状态,这也是promise这个名字的由来“承若”;

(2)一旦状态改变就不会再变,任何时候都可以得到这个结果,promise对象的状态改变,只有两种可能:从pending变为fulfilled,从pending变为rejected。这时就称为resolved(已定型)。如果改变已经发生了,你再对promise对象添加回调函数,也会立即得到这个结果,这与事件(event)完全不同,事件的特点是:如果你错过了它,再去监听是得不到结果的。

有了Promise对象,就可以将异步操作以同步操作的流程表达出来,避免了层层嵌套的回调函数。此外,Promise对象提供统一的接口,使得控制异步操作更加容易。

Promise也有一些缺点。首先,无法取消Promise,一旦新建它就会立即执行,无法中途取消。其次,如果不设置回调函数,Promise内部抛出的错误,不会反应到外部。第三,当处于pending状态时,无法得知目前进展到哪一个阶段(刚刚开始还是即将完成)。

Promise对象的用法

是一个构造函数,这个构造函数里有两个参数,分别是:resolve(成功之后的回调函数)、reject(失败之后的回调函数)。

因为promise表示的是一个异步操作,每当我们new一个promise实例,就表示一个具体的异步操作,那么这个异步操作的结果就只能有两种状态:成功/失败,两者都需要回调函数resolve/reject返回。所以内部拿到操作的结果后,无法使用return把操作结果返回给调用者,这时候只能用回调函数的形式来把成功或失败的结果返回给调用者。

 

promise实例生成以后,可以用then方法分别指定resolved状态和rejected状态的回调函数

 

then方法可以接受连个回调函数作为参数,第一个回调函数是promise对象的状态变为resolved时调用,第二个回调函数是promise对象的状态变为rejected时调用,其中,第二个函数是可选的,不一定要提供,这两个函数都接受promise对象传出的值作为参数;

*通过。then指定回调函数的时候,成功的回调函数必须传,失败的回调函数可以胜利。

如果前面的promise执行失败,不详影响后续操作终止,捕获异常的两种方式:

①可以为每个promise指定失败回调;

function(err){

console.log(……)

})

②最后加catch(function(err){

console.log(……)

})//表示如前面有任意一个有报错,立即报错,并终止后面的;如果前面无报错,前面正常执行。

4.如何通过Promise对象实现ajax?

 

getJSON是对XMLHTTPRequest对象的封装,用于发出一个针对JSON数据的HTTP请求,并且返回一个promise对象,需要注意的是,在getJSON内部,resolve函数和reject函数调用时,都带有参数;

如果调用resolve函数和reject函数时带有参数,那么他们的参数会被传递给回调函数,reject函数的参数通常是Error对象的实例,表示抛出的错误,resolve函数的参数除了正常的值以外,还可以是另一个promise实例;

 

5.什么是REST,用起来有什么好处?

答:

REST是一种设计API的模式。最常用的数据格式是JSON。由于JSON能直接被JavaScript读取,所以,以JSON格式编写的REST风格的API具有简单、易读、易用的特点。通过REST模式设计的API可以把web app 全部功能进行封装,可以很容易的实现前后端分离,使的前端代码易编写,后端代码易测试。

6.什么是闭包,举个例子说明一下

答:

“闭包就是能够读取其他函数内部变量的函数。例如在javascript中,只有函数内部的子函数才能读取局部变量,所以闭包可以理解成“定义在一个函数内部的函数“。在本质上,闭包是将函数内部和函数外部连接起来的桥梁。”

举例:创建闭包最常见方式,就是在一个函数内部创建另一个函数。下面例子中的 closure 就是一个闭包,

function func(){

vara =1 ,b = 2;

funciton closure(){

return a+b;

}

return closure;

}

 

7.promise、generator、async/await怎么使用,有什么区别?

答:

我们知道JavaScript是单线程语言,如果没有异步编程非得卡死。

以前,异步编程的方法有下面四种

回调函数

事件监听

发布/订阅

Promise对象

现在据说异步编程终极解决方案是——async/await

更详细的介绍参考下面这篇文章:

https://www.jianshu.com/p/1c9e9c161612

 

8.apply/call/bind 有什么区别?

答:

这三者的作用就是改变函数运行时this的指向。

call方法:

语法:call([thisObj[,arg1[, arg2[, [,.argN]]]]])

定义:调用一个对象的一个方法,以另一个对象替换当前对象。

说明:call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。

   如果没有提供 thisObj 参数,那么 Global 对象被用作 thisObj。

apply方法:

语法:apply([thisObj[,argArray]])

定义:应用某一对象的一个方法,用另一个对象替换当前对象。

说明:如果 argArray 不是一个有效的数组或者不是 arguments 对象,那么将导致一个 TypeError。

如果没有提供 argArray 和 thisObj 任何一个参数,那么 Global 对象将被用作 thisObj, 并且无法被传递任何参数。

bind方法:

语法:bind(thisArg[, arg1[, arg2[, ...]]])

定义:将接受多个参数的函数变换成接受一个单一参数。

说明:bind()方法所返回的函数的length(形参数量)等于原函数的形参数量减去传入bind()方法中的实参数量(第一个参数以后的所有参数),因为传入bind中的实参都会绑定到原函数的形参。

 

9.什么是变量提升、函数提升?

答:

变量提升:

简单说就是在js代码执行前引擎会先进行预编译,预编译期间会将变量声明与函数声明提升至其对应作用域的最顶端,函数内声明的变量只会提升至该函数作用域最顶层。

当函数内部定义的一个变量与外部相同时,那么函数体内的这个变量就会被上升到最顶端。

举例来说:

console.log(a); // undefined

var a = 3;

 

//预编译后的代码结构可以看做如下运行顺序

var a; // 将变量a的声明提升至最顶端,赋值逻辑不提升。

console.log(a); // undefined

a = 3; // 代码执行到原位置即执行原赋值逻辑

 

函数提升:

函数提升只会提升函数声明式写法,函数表达式的

  • 9
    点赞
  • 112
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值