Web前端面试题汇总之JS篇(五)

今天小编要跟大家分享的文章是关于Web前端面试题JS相关知识的文章。在之前的文章中小编也为大家分享过一些相关面试题，如果你想参加Web前端面试，正在做面试准备，就来看一看小编今天为大家准备的文章吧!

一、怎么判断一个object是否是数组

· 方法一

使用 Object.prototype.toString 来判断是否是数组

function isArray(obj){

return Object.prototype.toString.call( obj ) === '[object Array]';

}

这里使用call来使 toString 中 this 指向 obj。进而完成判断

· 方法二

使用 原型链 来完成判断

function isArray(obj){

return obj.__proto__ === Array.prototype;

}

基本思想: 实例如果是某个构造函数构造出来的那么 它的__proto__是指向构造函数的 prototype属性

· 方法三

利用JQuery, 利用JQuery isArray 的实现其实就是方法1。

function isArray(obj){

return $.isArray(obj)

}

二、继承有哪些方式

· ES6中的class继承

· 原型继承

· 构造继承

· 寄生组合式继承

· 实例继承

简单介绍一下前两种方式, 后面几种继承方式大家可以自行上网查找.

1. ES6中的class继承

class Animal {

constructor(name) {

this.name = name;

};

eat() {

console.log(this.name + '正在吃东西');

};

}

//继承动物类

class Cat extends Animal {

catchMouse(){

console.log(`${this.name}正在捉老鼠`);

}

}

var cat= new Cat('Tom猫');

cat.catchMouse();// Tom猫正在捉老鼠

细心的同学可能会发现, 在Cat 类中没有构造函数, 这里有一个小的知识点，就是ES6的继承方法中如果子类没有写构造函数的话就一般默认添加构造。举个例子。

class Cat extends Animal{

}

// 等同于

class Cat extends Animal{

constructor(name) {

super(name);

//super作为函数调用时，代表父类的构造函数。

}

}

注意：如果我写了构造函数但是没有写super的话，或者super方法的参数不对等等，编译器都会报错。

2. 原型继承

在ES6之前，也有很多继承的方法，其中一个很常用的方法就是使用原型继承。其基本方法就是一个父类的实例赋值给子类的原型。这个继承方式是通过__proto__建立和子类之间的原型链，当子类的实例需要使用父类的属性和方法的时候，可以通过__proto__一级级向上找;

function Animal(name) {

this.name = name;

}

Animal.prototype.eat= function () {

console.log(this.name + '正在吃东西')

};

function Cat(furColor){

this.furColor = furColor ;

};

Cat.prototype = new Animal();

let tom = new Cat('black');

console.log(tom)

缺点: 1. 子类实例时，无法向父类构造函数传参。 2. 父类的私有属性被所有实例共享

三、call、apply、bind之间的关系

这又是一个面试经典问题, 也是ES5中众多坑中的一个，在 ES6 中可能会极大避免 this 产生的错误，但是为了一些老代码的维护，最好还是了解一下 this 的指向和 call、apply、bind 三者的区别.

bind,apply,call三者都可以用来改变this的指向, 下面分别对他们进行比较分析:

apply 和 call

· 二者都是Function对象的方法, 每个函数都能调用

· 二者的第一个参数都是你要指定的执行上下文

· apply 和 call 的区别是: call 方法接受的是若干个参数列表，而 apply 接收的是一个包含多个参数的数组。

var a ={

ame : "Cherry",

fn : function (a,b) {

console.log( a + b)

}

}

var b = a.fn;

b.apply(a,[1,2]) // 3

b.call(a, 4,5,6) // 15

我们常常使用的验证是否是数组(前提是toString()方法没有被重写过):

function isArray(obj){

return Object.prototype.toString.call(obj) === '[object Array]' ;

}

bind 与 apply、call区别

var a ={

ame : "Cherry",

fn : function (a,b) {

console.log( a + b)

}

}

var b = a.fn;

b.bind(a,1,2)(); // 3

我们发现bind()方法还需要调用一次; 是由于 bind()方法创建一个新的函数,我们必须手动去调用。

bind,apply,call的共同和不同点：

· 三者都可以用来改变this的指向

· 三者第一个参数都是this要指向的对象，也就是想指定的上下文，上下文就是指调用函数的那个对象。(点前的那个对象，没有就是全局window)

· 三者都可以传参，但是apply是数组，而call是有顺序的传入

· bind 是返回对应函数，便于稍后调用;apply 、call 则是立即执行

以上就是小编今天为大家分享的关于Web前端面试题汇总之JS篇(五)的文章，希望本篇文章能够对正准备参加Web前端面试的小伙伴们有所帮助。想要了解更多Web前端面试相关知识记得关注达内Web培训官网，小编将继续为大家推荐相关面试题!最后祝愿小伙伴们能够面试成功，顺利找到工作!

【免责声明：本文图片及文字信息均由小编转载自网络，旨在分享提供阅读，版权归原作者所有，如有侵权请联系我们进行删除。】