interview

HTML5 新增的特性

HTML5 新增的特性：video audio canvas svg code main time output progress mark(高亮的引用文字) menu template nav aside footer/header section
CSS3 新增的特性：它被划分为模块，选择器，框模型，背景和边框，文本效果，2D/3D 转换 ，动画，多列布局，用户界面

HTML5 新增的特性: video andio code canvas svg time template section main footer/header nav menu output asider progress mark
CSS3 新增的特性：有八个模块- 选择器，框模型，背景和边框，文本效果 2d/3d 转换 动画 多利布局 用户界面

块元素有：div ul li dl dt dd p h1-h6 from
行元素: a b span img input strong select lable em button

区别就是：

1. 独霸一行，总是在新一行开始
2. 没有设置宽度的话就会继承父级的 100%宽度
3. 高度，行高，内外边距都可以设置
4. 可以容纳其他内联元素和其他块级元素

• 行元素区别

1. 行元素总是和其他元素在一行
2. 高度，行高，内外边距都不可以改变
3. 宽度和内容一样快，不可以改变
4. 行内元素只可以容纳文本或者行内元素，margin 和 padding 的上下无效，左右有效，可以用 line-height 设置高度。

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

1. 箭头函数是 ES6 的 API
2. 箭头函数本身没有 prototype(原型),所以箭头函数本身没有 this
3. 箭头函数的 this 指向在定义的时候继承自外层的第一个普通函数的 this
4. 下面就讲述在一个普通函数中定义箭头函数，在另一个普通函数中执行箭头函数
5. 不能直接修改箭头函数的 this 指向，但是我们可以通过间接的方式来修改箭头函数的 this,去修改箭头函数继承的普通函数的 this ，箭头函数自身也就发货所能了改变
6. 箭头函数外层没有普通函数，严格模式还是非严格模式下，箭头函数的 this 都会指向 windows(全局对象)
7. 唔，这个问题实际上是面试官提出来的，当时我认为的箭头函数规则就是：箭头函数的 this 指向继承自外层第一个普通函数的 this，现在看来真是不严谨(少说一个定义的时候)，要是面试官问我：定义和执行不在同一个普通函数中，它又指向哪里，肯定歇菜…
8. 在非严格的模式下会指向全局对象，在严格的模式下会指向 undefind
9. 箭头函数外层没有普通函数，严格模式和非严格模式下箭头函数的 this 都会指向 windows 全局对象
10. 学箭头函数的时候，学到另一个知识点 ES6 的 rest 参数 … 扩展符
11. 箭头函数都是匿名函数，都不用写 function
12. 箭头函数只有一个参数的时候可以省略 () let f = a => a // 传入 a 并返回 a 相当于 f(a){ return a }
13. 箭头函数只有一条语句的时候可以省略 {} 和 return
14. 箭头函数用圆括号是正确的写法 let fun = (a)=>({a})
15. 箭头函数相对于普通函数语法更加简洁优雅
16. 箭头函数不支持 new.target
17. 使用 new 调用箭头函数会报错，因为箭头函数没有 constructor
18. 箭头函数 this 取值于外部普通函数的 this ，不能直接修改或者通过 call apply bind 修改箭头函数的 this 值，但是可以修改外部普通函数的 this 值来修改箭头函数的 this 值，还可以调用。

css 隐藏页面元素有哪些方法

1. display:none; 这个是彻底的隐藏元素，从文档流中消失，不占据页面空间的大小，也不能进行交互，更不会影响布局。
2. z-index:-999 原理是将层级放到底部，这样就被覆盖了，也是看起来就是隐藏了
3. opcity:0; 本质上是将元素的透明度设置为 0，看起来是隐藏了，但是还会占据页面空间的大小和进行相对应的交互。
4. overflow:hidden; 只隐藏元素溢出的部分，但也据页面空间的大小，不能进行交互。
5. tranfrom：scale(0,0); 平面变换，只是把元素缩小为 0，占据空间，不可交互
6. visibility：hidden;占据空间，不可交互

// sum = (这里写的是 sum 传的参数 xxxx)
export const sum = (xxxx) => xxxx.reduce((res, ele) => (res += ele), 0);
export const sum1 = (xxx) => xxx.reduce((res, ele) => res * ele, 1);
export default sum;

forEach 函数

• foreach 循环用于列举出集合中所有的元素
• foreach 语句中的表达式由关键字 in 隔开的两个项组成。
• in 右边的项是集合名，in 左边的项是变量名，用来存放该集合中的每个元素。

该循环的运行过程如下：每一次循环时，从集合中取出一个新的元素值。放到只读变量中去，如果括号中的整个表达式返回值为 true，foreach 块中的语句就能够执行。一旦集合中的元素都已经被访问到，整个表达式的值为 false，控制流程就转入到 foreach 块后面
的执行语句。

const array = ["aaa", "bbb", "ccc", "ddd"];
array.forEach((item, index) => {
  console.log(item); // aaa bbb ccc  ddd
  console.log(index); // 0 1 2 3
  console.log(arr); // 每一次都展示一次数组
});

filter 函数

const arr = [11, 22, 33, 44, 55, 66];
const getArr = arr.filter((item) => {
  console.log(item); // 打印数组的每个元素   11, 22, 33, 44, 55, 66
  return item > 11;
});
console.log(...getArr); // 22 33 44 55 66
},

在 上使用 v-for

• 不想套标签就用 <template> 可以用 v-for

<ul>
  <template v-for="item in xxxx">
    <li>{{ xxxx }}</li>
  </template>
</ul>

1121

• 8 种基本数据类型

1. 基本数据类型 String number boolean
2. 复合型数据类型 Object Array function
3. 其他数据类型 null undefined

1122

HTML 5 新增的特性有 audiu vidiu canva svg footer/header nav section main time template aside
css3 的特性分为八个模块 选择器 框模型 背景和边框 文本效果 2d/3d 转换 动画 多列布局 用户界面

块元素 div ul li p h1-h6 from dd dt dl
行元素 a b spam img input buttom strong select laber em
块元素和行元素的区别：

1. 块元素总是独占一行，行元素会和其它元素并列一行
2. 块元素如果不设置宽高的话会继承父级宽的 100% ，行元素的设置宽高无效，他会根据自己的内动来撑开，但是可以用 line-height 设置高。
3. 块元素可以设置 内外边距，行元素不可以。
4. 块元素可以包含块元素和其他元素，但是行内元素不可以设置内外边距

箭头函数：

1. 箭头函数是 ES6 API
2. 箭头函数本身没有 prototype(原型) ,所以箭头函数本身没有 this
3. 箭头函数继承外层函数的 this 指向，而且不能够直接修改箭头函数的 this,但是可以修改箭头函数外层的 this 指向，从而间接修改箭头函数的 this 指向。
4. 如果箭头函数外层没有普通函数，非严格模式下 this 指向 window(全局对象)，在严格模式下 this 指向 undefined。
5. 箭头函数是匿名函数可以不写 function
6. 箭头函数只传一个参数的时候可以省略 () let a = () =>{}
7. 箭头函数只有一条语句的时候可以省略 {} 和 return const a = (a,b) => a+b;
8. 箭头函数不支持 new.target，使用 new 调用箭头函数会报错，因为箭头函数没有 constructor
9. 箭头函数的语法比普通函数的语法更加简洁和优雅。

css 隐藏页面元素有那些方法

1. opcity:0; 把该元素的透明度设置为了，但是可以占据页面的大小，可以进行交互。
2. transfrom:scale(0,0) 把该元素缩小为 0，占据页面的大小，但是不可以交互。
3. z-index:-9999 把该元素的层级设置到最低，不占据页面大小，不可以进行交互。
4. overfloat:hidden; 只隐藏元素溢出的部分，占据页面大小，不可以进行页面交互。
5. visibility:hidden; 占据空间，不可交互。
6. display:none; 真正意义做到隐藏该元素，从文档流中消失，不占据大小，不可以进行交互，更不会影响布局。

• 8 种数据类型：string number boolean object function array null undefined

const let var 三这的区别,也是 ES6 新增的特性。

1. const let 定义不被使用会被报错
2. const 通常定义常量,不可修改，定义必须要赋值,不赋值会报错。
3. let 可以修改，定义可以不赋值,使用会显示 undefined 。

• let

1. 没有预解析过程，即没有变量声明提升。
2. 不可以重复声明。let a = 2 let a =3
3. {} 代表块级作用域， let 有块级作用域， var 只有函数作用域。

• const 声明常量，只可以声明一次，必须赋值，不可以修改。

1. const a 报错 必须赋值
2. const a = 1; a = 2; 报错 不可修改
3. const obj = { name:eee } obj.name = hhh 不会报错，因为 obj.name = hhh 修改的地址里面的值，并没有修改地址里面的值所以不会报错。

const let var

1. 是否存在变量声明提升
   声明变量提升是变量被定义之前被使用
   var 存在声明变量提升 const let 不存在声明变量提升
2. 是否可以重复声明变量
   var 可以重复声明变量 const let 不可以重复声明变量
3. 是否可以改变变量值
   var let 可以改变变量值 const 一旦被定义就不可以改变变量值，但是对象的话可以，因为 改变的是对象属性的存储地址的值，并不是改变地址
4. 声明是否必须赋值
   var let 可以不赋值，但是 const 必须赋值
5. 是否存在块级作用域
   var 不存在块级作用域，但是存在全局作用域和函数作用域，有时候会污染到全局 let const 存在块级作用域，也就是只能在 {} 里面使用
6. 是否存在暂时性死区
   var 不存在暂时性死区 let const 存在暂时性死区

把扁平化数据变成树(Tree)

let menuTree = [];
menuList.forEach((item) => {
  // 确立根节点
  if (item.id === -1) {
    menuList.push(item);
  } else {
    // 确立第二层以及往后每层的数据
    const o = menuList.find((e) => e.id === item.pid);
    // 在原数组内找到 id 跟当前 pid 相同的对象
    if (o.children) {
      o.children.push(item);
    } else {
      o.chidlren = [item];
    }
  }
});

cookie 验证和 Token 验证的区别是什么

ES6 的解构赋值

vuex 各个函数中的各个方法接收的第一个参数都是什么

js 中的过滤数组 filter

1. filter() 方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。
2. 不会改变原数组
3. return 后面判断结果，取布尔值，true 的话就填入新的 filter 数组中，false 的话，不会添加到 filter 新的数组中。

var arr = [1, 2, "", 3, " "];
var arr2 = arr.filter(function (item) {
  return item;
}); //[1,2,3,' ']

var arr = ["aa", "cb", "cc", "bd", "rf"];
var newArr = arr.filter((item) => item.indexOf("b") < 0); //["aa", "cc", "rf"]

• javaScript 中的过滤数组 filter()

1. 不会改变原数组
2. filter() 创建一个新数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。
3. return 后面判断结果，true 的话就添加进新数组，false 的话就不会添加入新数组中。
4. 自己会创建一个数组来存储判断通过的数据
5. 不会改变原数组
6. true 就存储，false 就不存储

递归元素

function add(x) {
  if (x < 1) {
    return 0;
  }
  return x + add(x - 1);
}
console.log(add(5));
function add(x) {
  if (x >= 10 && x < 20) {
    return 0;
  }
  return x + add(5);
}

混入 mixin

1124

插件通常用来为 Vue 添加全局功能。插件的功能范围没有严格的限制——一般有下面几种：

1. 添加全局方法或者 property。如：vue-custom-element
2. 添加全局资源：指令/过滤器/过渡等。如 vue-touch
3. 通过全局混入来添加一些组件选项。如 vue-router
4. 添加 Vue 实例方法，通过把它们添加到 Vue.prototype 上实现。
5. 一个库，提供自己的 API，同时提供上面提到的一个或多个功能。如 vue-router

• beforeCreate 和 created 的区别
  created：获取 事件 data dom 节点 处理完毕的时候

1126 盒模型

1126 创建函数组件 vue-advance

created mounted

在 created 和 mounted 这两个发请求触发我们的 axios 都差不多，这两个都是同步的生命钩子，created 执行完了， mounted 就执行。axios 发请求都是异步的，请求的结果肯定在这两个人之后执行，但是通常习惯用 created 发请求。他们两者又有什么区别呢？

1127

1. 做项目遇到代理问题