前端面试题：JS篇

1.var let const区别

　　var是ES5语法，let const是ES6语法；

　　var有变量提升(不会报错，只会打印出undefined)

　　var和let是变量可以修改，count是常量不可以修改

　　let和count是块级作用域，var没有

2.typeof能判断哪些类型

　　undefined、string、number、boolean、symbol [值类型]

　　object(注意 typeof null === ‘object’) [引用类型instanceof]

　　function

3.列举强制类型转换和隐式类型转换

　　强制 parseInt parseFloat Number string toString等(toString转换null undefined会报错)

　　隐式 +拼接字符串 == === if 逻辑运算等

4.split()和join()的区别

　　split() 将字符串切割成数组 ‘1-2-3’.split(‘-’)

　　join()  将数组转换为字符串  [1,2,3].join(‘-’)

5.数组 pop push unshift shift 分别是什么

　　pop尾部删除 —— 返回删除元素 —— .pop()

　　push尾部添加 —— 返回length —— .push(要添加的元素)

　　unshift头部添加 —— 返回length —— .unshitf(要添加的元素)

　　shift头部删除 —— 返回删除元素 —— .shift()

6.数组slice和splice区别

　　slice是截取 splice是剪接；

　　slice是纯函数 splice是非纯函数

7.数组的API有哪些是纯函数(纯函数不改变源数组没有副作用，返回一个数组)

　　concat数组的拼接 .concat([50,60,70])

　　slice(start,end)按照数组的下标截取(不包括end)

　　.map()  .filter过滤

8.ajax请求get和post的区别

　　get一般用于查询操作，post一般用于用户提交操作

　　get参数拼接在url上，post放在请求体内(数据体积可能更大)

　　安全性：post易于防止CSRF/XSRF跨站请求伪造

9.闭包是什么？有何特性？有何影响？

　　特性：①函数嵌套函数

　　　　　②函数内部可以引用外部的参数和变量

　　　　　③参数和变量不会被垃圾回收机制回收

　　好处：避免全局变量的污染，私有成员的存在

　　缺点：①常驻内存，增加内存使用量 ②使用不当容易造成内存泄漏

　　应用场景：作为参数被传递，作为返回值被返回

　　* 自由变量的查找，要在参数定义的地方 而不是执行的地方

10.如何阻止事件冒泡和默认行为

　　event.stopPropagation() 阻止事件冒泡       (IE:event.cancelBubble = true)

　　event.preventDefault()  阻止默认行为/事件  (return false)

11.添加、删除、替换、插入到某个节点的方法

　　新建节点：createElement() //创建一个具体的元素
　　　　　　　createTextNode() //创建一个文本节点

　　添加  appendChild()

　　移除  removeChild()

　　替换  replaceChild()

　　插入  insertBefore()

12.如何减少DOM操作

　　缓存DOM查询结果

　　多次DOM操作合并到一次插入

13.解释jsonp原理，为何不是真正的ajax

　　jsonp是动态创建script标签，回调函数

　　而ajsx是页面无刷新请求数据操作，通过XMLHttpRequest来实现的

14.document load 和 document ready的区别

window.addEventListener('load', funtion(){
    // 页面的全部资源加载完才会执行，包括图片、视频等
})
document.addEventListener('DOMContentLoaded', funtion(){
    // DOM渲染完即可执行，此时图片、视频还可能没有加载完(常用)
})

15.‘==’和‘===’区别

　　==会自动转换类型，然后再比较

　　===不转换类型之前比较，严格相等

　　使用场景：①只有在 ==null 时用双等，其他一律用===

            　　　  ②这是jQuery源码中的写法，推荐

16.函数声明和函数表达式的区别

　　函数声明function fn(){…}

　　函数表达式 const fn = function(){…}

　　函数声明会再代码执行前预加载，而函数表达式不会

17.new Object()和Object.create()的区别

　　{}等同于new Object()，原型Object.prototype

　　Object.create(null) 没有原型

　　Object.create({…})可指定原型

18.如何用js实现继承

　　①class继承  ②prototype继承

19.如何捕获js中的异常

①用try-catch手动捕获
②window.onerror = function(message信息, source源码, lineNum行号, colNum, error){
    // 第一，对于跨域的js，如CDN的，不会有详细的报错信息
    // 第二，对于压缩的js，还要配合sourceMap反查到未压缩代码的行、列
}

20.什么是JSON

　　json是一种数据格式，本质是一段字符串

　　json格式和JS对象结构一致，对JS语言更友好(json现已覆盖大多XML)

　　window.JSON是一个全局对象：.stringify对象转化json字符串 .parse字符串转换为对象

21.获取当前页面url的参数

　　传统方式：location.search

　　新的API：URLSearchParams

function query(name){
    const search = location.search
    const p = new URLSearchParams(search)
    return p.get(name)
}
query('a')

22.数组去重一行代码实现

  [...new Set()]