08Js面试题

105 阅读2分钟

Offer 驾到,掘友接招!我正在参与2022春招系列活动-刷题打卡任务,点击查看活动详情

一、typeof能返回的数据类型

  • object
  • number
  • function
  • boolean
  • undefined
  • string

image.png

二、传统事件绑定和符合w3c标准的事件绑定

传统事件绑定

  • 事件覆盖。如果给同一个标签使用传统事件绑定方法绑定了多次或多次同类型的事件,那么后面绑定的事件会覆盖之前绑定的
  • 不支持DOM事件流
<div onclick="func()">传统事件绑定</div>
div.onclick = function(){}

符合w3c标准的事件绑定(addEventListener/attchEvent)

非IE浏览器 + IE浏览器(>=IE9)(addEventListener)

  • 不会进行事件覆盖。如果给同一个标签使用传统事件绑定方法绑定了多次或多次同类型的事件,那在触发事件时,所有的绑定会依次触发
  • 支持DOM事件流(第三个参数表示事件是否在捕获阶段执行,默认为false)
  • 传参不需要前缀on
//此时事件将在事件捕获阶段执行
div.addEventListener("click",function(){},true)

IE浏览器(IE9以前)(attchEvent/detachEvent)

  • 不会进行事件覆盖
  • 不支持事件捕获,只支持事件冒泡
  • 传参需要前缀on
div.attachEvent('onclick',function(){});

三、实现继承的方法

原型链继承

  • 这种方法就是让子类的原型指向父类的对象来实现继承
function Animal(){
    this.age = 5;
}

function Dog(){
    this.name = "mick";
}

// 让Dog的原型指向Animal对象,这样Dog的对象就拥有了Animal对象的属性和方法
Dog.prototype = new Animal();
let dog = new Dog();
console.log(dog.age); // 5

借用构造函数继承

  • 该方法就是利用call或者apply方法,将Anmial对象的属性和方法构造函数的this指向Dog对象,以此让Dog所有对象拥有Anmial对象的属性和方法
function Animal(){
    this.age = 5;
}

function Dog(){
    // 借用Animal对象的构造函数
    Animal.call(this);
    this.name = "mick";
}
 
let dog = new Dog();
console.log(dog.age); // 5

原型链+构造函数组合继承

  • 这种方式是上面两种方法的结合

寄生式继承

  • 这种方式就是利用一个普通函数去调用其他的构造函数来创建一个对象的实例,但这个对象又不是这个构造函数的实例
 function Japanese(name,language){
     this.name = name;
     this.language = language;
 }
 
 function createChinese(name,language){
     let obj = {};
     Japanese.call(obj,name,language);
     return obj;
 }
 
 let chinese1 = createChinese("张三","普通话")
 console.log(chinese.constructor);//Object