前端面试小结（7）

let var const 区别

let
允许创建块级作用域，ES6 推荐在函数中使用 let 定义变量
不允许重复声明
不存在变量提升提前调用会报错
存在暂时性死区
变量只能声明一次，不能重复声明（同一个作用域下）
var
①var的作用域是函数作用域，在函数内利用var声明一个变量，则在函数内这个变量有效。
②变量声明提升
var可以重复声明变量
const
声明常量的关键字
声明的同时必须赋值不能再次赋值
不能重复声明常量命名，大写字符
不出现变量提升
假如const定义的变量是一个对象，那么可以给这个对象的变量赋值、增加属性、删除属性等操作都是可以的。
因为const是限制了定义的变量不再重新分配地址，也就是地址不变，但是指向的地址上存储的内容是可变的。
const定义了一个无法重新分配内存的变量。const仅仅阻止重新分配，而不是不可变的

箭头函数和普通函数的区别

箭头函数不支持重命名函数参数,普通函数的函数参数支持重命名

箭头函数相对于普通函数语法更简洁优雅：
(1)箭头函数都是匿名函数，并且都不用写 function(2)只有一个参数的时候可以省略括号(3)函数只有一条语句时可以省略 {}和 return(4)简化回调函数，让你的回调函数更优雅

结普通函数和箭头函数的区别：

箭头函数没有 prototype(原型)，所以箭头函数本身没有 this

箭头函数的 this 在定义的时候继承自外层第一个普通函数的 this。

如果箭头函数外层没有普通函数，严格模式和非严格模式下它的 this 都会指向 window(全局对象)

箭头函数本身的 this 指向不能改变，但可以修改它要继承的对象的this。

箭头函数的 this 指向全局，使用 arguments 会报未声明的错误。

箭头函数的 this 指向普通函数时,它的 argumens继承于该普通函数

使用 new调用箭头函数会报错，因为箭头函数没有 constructor

箭头函数不支持 new.target

箭头函数不支持重命名函数参数,普通函数的函数参数支持重命名

箭头函数相对于普通函数语法更简洁优雅

箭头函数的注意事项及不适用场景

箭头函数的注意事项：

箭头函数一条语句返回对象字面量，需要加括号;

箭头函数在参数和箭头之间不能换行;

箭头函数的解析顺序相对 ||靠前;

不适用场景：箭头函数的 this 意外指向和代码的可读性。

vue 路由跳转四种方式 (带参数)

1、router-link
2、this.$router.push() (函数里面调用)

this.$router.replace() (用法同上,push)
this.$router.go(n)向前或者向后跳转n个页面，n可为正整数或负整数

this.$router.push
跳转到指定url路径，并想history栈中添加一个记录，点击后退会返回到上一个页面
this.$router.replace
跳转到指定url路径，但是history栈中不会有记录，点击返回会跳转到上上个页面 (就是直接替换了当前页面)
this.$router.go(n)
向前或者向后跳转n个页面，n可为正整数或负整数

ES6 ES7 ES8常用新特性

ES6新特性
let && const
iterable类型
解构赋值
=>函数
...操作符
类
模块的导入(import)和导出(export default/export)
一些数组字符串的新方法...
Promise
ES7新特性
Array.prototype.includes （includes在一个数组或者列表中检查是否存在一个值，给任何开发人员带来简单性）
Exponentiation Operator(求幂运算)
ES8新特性
Object.values/Object.entries
String padding(字符串填充)
Object.getOwnPropertyDescriptors
函数参数列表和调用中的尾逗号（Trailing commas）
异步函数（Async Functions）

跨域的三种主流解决方案：

跨域是浏览器做出的限制,和后端没关系

⦁ 是jsonp
jsonp实现原理：主要是利用动态创建script标签请求后端接口地址，然后传递callback参数，后端接收callback，后端经过数据处理，返回callback函数调用的形式，callback中的参数就是json
⦁ 是代理（前端代理和后端代理）
前端代理我在vue中主要是通过vue脚手架中的config中的index文件来配置的，其中有个proxyTable来配置跨域的
⦁ 是CORS
CORS全称叫跨域资源共享，主要是后台工程师设置后端代码来达到前端跨域请求的

cookie,localStorage和sessionStorage的区别

三者区别

存 sessionStorage.setItem("key", "value"); //存到key字段 localStorage.setItem("site", "js8.in");
取var value = sessionStorage.getItem("key"); //取指定key本地存储的值 var site = localStorage.getItem("site");
删sessionStorage.removeItem("key");//删除指定key本地存储的值 localStorage.removeItem("site");
清除key/value sessionStorage.clear(); localStorage.clear();

CSS禁止手机浏览器点击H5界面中的图片，弹出保存等系统选项

img{
    pointer-events:none;
    -webkit-user-select:none;
    -moz-user-select:none;
    user-select:none;
}