《web前端陪你读书》 面试押题整理

音频连接：www.ximalaya.com/30018073/so…

沙翼老师一直是我比较关注和欣赏的业内大佬，他的节目深刻浅出，对初学者大有裨益，对有必定基础的前端从业者创建知识体系也有必定的帮助。本文整理比较仓促，确定也会存在许多错误，只做本人复习之用，不喜勿喷。

1，js数据类型

简单类型：布尔 字符串 数字 undifined null

复杂类型：object

2，如何判断数据类型

简单类型：用typeof判断，typeof是一元运算符，能够不跟括号

可是 null和object返回的都是object

3，如何对对象类型进行判断，尤为是数组

两种办法：constructor和isArray

正确办法：Object.protoType.tostring.call( arr )

4，数组的方法

push pop shift unshift reverse concat slice splice index filter...

对原数组有影响的：push pop shift unshift reverse sort splice

5，数组如何去重

1-空数组，循环push，indexof()判断

2-splice，从原数组上进行操做

3-根据对象属性不能重复的特性

4-对原数组进行排序，而后循环，相邻的若是重复即删除

5-最短的去重办法：[…new Set( arr )]

var arr = [1,2,2,3,4] // 须要去重的数组

var set = new Set(arr) // {1,2,3,4}
var newArr = Array.from(set) // 再把set转变成array

console.log(newArr) // [1,2,3,4]
复制代码

6,伪数组

1-dom选择器选择出的节点列表

2-arguments对象

3-jq选择器选择出的jq对象

转换方式：新建数组，将伪数组依次push进去

7,字符串

charAt concat...

8，数字

如何判断是否 nan，最多见的方式 isNan

可是isNan是用来判断传进来的参数可否转化为数字的，所以首先要判断是否为数字

更好的判断方式：用===和自身进行判断，js中只有nan和自身是不全等的

9，布尔

有哪些转换成

undefine 0 -0 null false "" NAN

空对象和空数组转换成对象都是true，newBealean(false)为true

!!将数据快速转化成布尔类型

10，new作了什么

1-建立空对象

2，修改this指针，将this指针指向建立的对象

3，运行构造函数中全部的代码

4，将建立的对象做为返回值返回

11，new若是没有参数，能够不写括号；若是在构造函数中显式的返回了非对象，返回的依然是对象，若是显式地返回了其它对象，则返回其它对象（单例模式了解一下）

12，继承方式

1-原型链继承 对象a,对象b

将b继承于a，b.prototype=new a()

只能继承原型对象上的属性，这些属性都是共享的，没法实现多继承

2-构造函数式继承

在b中将a的函数所有运行一遍

能够实现多继承，可是只能继承构造函数里的属性

3-组合式继承，也就是将原型链继承和构造函数式继承都写一遍

开发中最多见的，代码执行两遍，速度较慢

4-原型式继承，

5-寄生式继承

6-组合寄生式继承（完美继承）

13，<script></script>标签

两个特殊的属性：defer async

defer延迟执行，同时并行加载多个js，而后按上下顺序依次执行

async异步加载，下载后当即执行，不必定按上下顺序

1-js中，js代码会堵塞html css代码渲染

2,-正常js下载，都是同步依次下载，可是只要写了defer或者async都会改成异步下载的方式，aynsc在外部js加载完成以后若是浏览器空闲，并发load事件触发以前执行

defer在js加载完成以后，文档解析完成以后才会执行，也就是说，只要写了defer，即便你把script标签放在head里，也相似于放在body最下面

14，promise中then和catch的返回值永远是一个新的promise实例，若是显式地返回一个非promise对象，后面的then和catch都会当即执行

15，es6新增

数组方法，from

箭头函数的变化：没有arguments对象，this指向也发生了变化

16，js中的事件实现

1-dom嵌入，标签里写onclick

2-事件绑定，得到节点onclick，从html里转移到js里，方便管理

3-事件监听

浏览器兼容性处理：ie是attachEvent和dettachEvent

17，js事件流

捕获-目标-冒泡

18，target和currentTarget的区别

target是指目标节点

currentTarget当前对象的目标节点

<ul>
    <li><span>hello 1</span></li>
    <li><span>hello 1</span></li>
    <li><span>hello 1</span></li>
    <li><span>hello 1</span></li>
  </ul>
  <script>
    let ul = document.querySelectorAll('ul')[0]
    let aLi = document.querySelectorAll('li')
    $('ul').on('click','li',function(e){
 
        console.log(e.target)   //  被点击的元素
        console.log(e.currentTarget)   //  li   
        console.log(e.currentTarget === this)  // true
    })
  </script>
复制代码

<ul>
    <li>hello 1</li>
    <li>hello 2</li>
    <li>hello 3</li>
    <li>hello 4</li>
  </ul>
  <script>
    let ul = document.querySelectorAll('ul')[0]
    let aLi = document.querySelectorAll('li')
    for(let i=0;i<aLi.length;i++){  
      aLi[i].addEventListener('click',function(e){
        let oLi1 = e.target  
        let oLi2 = e.currentTarget
        console.log(oLi1)  // li
        console.log(oLi2)  // li
        console.og(oLi1===oLi2)  // true
      })
    }
  </script>复制代码

19，http的状态码

1-信息响应

2-成功了

3-服务器重定向响应，主要是为了知足特定的

4-客户端错误

5-服务端错误

20，敲下url后发生了什么

浏览器查ip地址（dns解析，路由缓存，浏览器缓存）-浏览器发出http请求-服务器重定向响应-浏览器跟踪重定向响应，取得地址-服务器接受请求，返回http响应，包括html等代码-浏览器按照本身的方式进行渲染

21，跨域

jsonp（json padding）是经过建立script标签实现的

postMessage，最好转成json字符串发过去