前端面试题7

1.为什么 data function 是而不是object
2.vue生命周期钩子，dom 加载在哪个完成
mounted
3.vue路由钩子
Router.beforeEach
Router.afterEach
beforeRouteEnter
afterRouteLeave
beforeRouteUpdate (2.2 新增)
beforeEnter
4.做过的项目中，哪个收获最多
5.为什么从上一家公司离职
6.对react了解多少
7.自己封装过哪些组件
8.组件传参的方式
9.熟悉es6的哪些
10.请写出面向对象的特性，并做简要说明

————————————————————————-

1.父子组件传值
2. 面向对象的特征，举例
3.什么是闭包
4.js 堆栈理解
5.js 创建节点
6.基本数据类型
7.async await 举例
8.面向对象

//9.写出下面代码的输出结果
class father {
  num = 10;
  show() {
    this.num +=5;
    console.log(this.num); //25
  }
}

class child extends father {
  num = 20;
  show() {
    super.show();
    this.num -=5;
    const num = 30;
    console.log(num); //30
    console.log(this.num); //20
    console.log(super.num); //undefined
  }
}

let a = new child;
a.show()

//10. 描述什么是闭包并写出以下代码的输出结果
function f1() {
  var N = 0;
  function f2() {
    N += 1;
    console.log(N);
  }
  return f2;
}
var result = f1();
result(); //1
result(); //2
result(); //3

//11. 请写出下面代码的输出结果
var name = 'jason';
var person = {name: 'jack'};
var persons = [];
persons.push(person);
person.name = name;
name = 'judy';
console.log(name); //judy
console.log(person); //{ name: 'jason' }
console.log(persons); //[ { name: 'jason' } ]

//12.  组件my-component 对data值变化的监控
var data = {id: 123, name:'Jason' };
<my-component :data='data' />

watch: {
  data: function(newV,oldV) {
    console.log(newV);
    console.log(oldV);
  }
}

——————————————————————————————

1.数组排序
2.产生跨域的原因和情形

请求方式/协议/域名/端口 任一不一样就会产生跨域

3.兄弟组件通信方式
4.浏览器10px字体
5.盒子模型
6.垂直居中的方法
7.slice
8.keep alive
9.set up
10.登录验证怎么做的
11.微信小程序有没有遇到兼容问题
12.em rem px rpx 区别
13.flex
14.meta
15.router 怎么配，有哪些参数
16.什么都问（兴趣爱好，遇到了哪些问题，家里哪些人）
17.map foreach区别
18.箭头函数有this吗？指向什么
箭头函数没有自己的this, 它的this是继承而来; 默认指向在定义它时所处的对象(宿主对象),而不是执行时的对象, 定义它的时候,可能环境是window; 箭头函数可以方便地让我们在 setTimeout ,setInterval中方便的使用this
19.http状态码
20.数据类型及判断方法

//21.给下面数组按id值的大小升序排列
const arr = [
  {id:2, name:'test2'},
  {id:1, name:'test1'},
  {id:3, name:'test3'},
]

function sort(arr) {
  arr.sort((a,b) => a.id-b.id)
  return arr; 
}

sort(arr)