一些面试题

1、js的new操作符做了哪些事情答：new操作符新建了一个空对象，这个对象原型指向构造函数的prototype，执行构造函数后返回这个对象 1、创建一个空的对象 2、链接到原型 3、绑定this指向，执行构造函数 4、确保返回的是对象
2、js的各种位置，比如clientHeight,scrollHeight,offsetHeight ,以及scrollTop, offsetTop,clientTop的区别？答：clientHeight：表示的是可视区域的高度，不包含border和滚动条offsetHeight：表示可视区域的高度，包含了border和滚动条scrollHeight：表示了所有区域的高度，包含了因为滚动被隐藏的部分。clientTop：表示边框border的厚度，在未指定的情况下一般为0scrollTop：滚动后被隐藏的高度，获取对象相对于由offsetParent属性指定的父坐标(css定位的元素或body元素)距离顶端的高度。
3、JS中避免命名冲突的三个方法答：命名空间，闭包，匿名函数
4、JS中有几种数据类型分别是哪几种？答：Number,String,Boolean,Object,Null,Undefined
5、对于MVVM的理解？答：MVVM 是 Model-View-ViewModel 的缩写。Model代表数据模型，也可以在Model中定义数据修改和操作的业务逻辑。View 代表UI 组件，它负责将数据模型转化成UI 展现出来。ViewModel 监听模型数据的改变和控制视图行为、处理用户交互，简单理解就是一个同步View 和 Model的对象，连接Model和View。在MVVM架构下，View 和 Model 之间并没有直接的联系，而是通过ViewModel进行交互，Model 和 ViewModel 之间的交互是双向的， 因此View 数据的变化会同步到Model中，而Model 数据的变化也会立即反应到View 上。ViewModel 通过双向数据绑定把 View 层和 Model 层连接了起来，而View 和 Model 之间的同步工作完全是自动的，无需人为干涉，因此开发者只需关注业务逻辑，不需要手动操作DOM, 不需要关注数据状态的同步问题，复杂的数据状态维护完全由 MVVM 来统一管理。
1、Vue的生命周期（8个阶段）答：beforeCreated created beforeMounted mounted beforeUpdated updated beforeDestroy destroyed
2、this的四种用法答：初始化为window 在被调用的函数中指当前对象 在构造函数中指向创建的对象 在call/aplly中指第一个参数
3、闭包是什么，有什么特性，对页面有什么影响答：所谓闭包指有权访问另一个函数作用域中变量的函数 保护变量 容易造成内存泄露
4、call和apply的区别答：call是一个个传值 apply可以传一个数组
5、请描述一下cookies、sessionStorage与localStorage的区别答：cookie 4kb 刷新消失 local
1、Vue组件间的参数传递 000答：在 Vue 中，可以使用 props 向子组件传递数据。 子组件向父组件传递数据，KaTeX parse error: Expected '}', got 'EOF' at end of input: …直到在该vue实例上调用vm.mount(el)。3，
22，Vue组件间的参数传递 答：在 Vue 中，可以使用 props 向子组件传递数据。 子组件向父组件传递数据，$emit 来调用父组件事件，并传递数据
23，路由嵌套children
6，盒子模型w3c：盒子范围包括content，padding，border，margin，但是他的content不包括内边距和边框ie：盒子范围也是cotent，padding，border，margin，但是content包括了padding和borderflex布局
7，元素水平居中的方法：行内元素：text-align：center；确定宽度的元素，（1）margin：0 auto；（2）使用绝对定位，left：50%；margin-left：-一半宽度（3）绝对定位，top：0；left：0；right：0；bottom；0;margin:auto；未知宽度的元素：（1）绝对定位，left：50%；transform：translateX（-50%）；
8，animate属性动画帧，animation：名字 时间 速度 效果9，transltate属性 h5新属性 规定是否应该翻译元素内容。

我是汉字我骄傲

10，css实现宽度100%,宽高16：9的矩形先计算高度，假设宽100%，那么高为h=9/16=56.25%，padding-bottom：56.25%；
11，如何实现左边两栏一定比例，左栏高度随右栏高度自适应？使用flex布局，大盒子display：flex；一个盒子width：20%；一个width：80%；
12，变量提升
13，闭包的理解，使用场景能够访问另一个函数内部变量的函数就称为闭包，使用场景，设计私有的方法和变量
14，每个对象都会在其内部初始化一个属性，就是prototype(原型)，当我们访问一个对象的属性时， 如果这个对象内部不存在这个属性，那么他就会去prototype里找这个属性，这个prototype又会有自己的prototype， 于是就这样一直找下去，也就是我们平时所说的原型链的概念。3、JS 中继承实现的几种方式？答：原型链继承 构造继承 实例继承 拷贝继承 组合继承等
15，iframe优点缺点1.iframe能够原封不动的把嵌入的网页展现出来。缺点：会产生很多页面，不易管理可能会出现滚动条，比较复杂
16，ajax原生写法
17，前端处理跨域答：跨域解决方案1、 通过jsonp跨域2、 document.domain + iframe跨域3、 location.hash + iframe4、 window.name + iframe跨域5、 postMessage跨域6、 跨域资源共享（CORS）7、 nginx代理跨域8、 nodejs中间件代理跨域9、 WebSocket协议跨域
18，怎么判断两个对象是否相等转为字符串对比，或者进行遍历对比
19，一些性能优化不应该使用setTimeout，而应该是用setInterval
20，箭头函数中的this箭头函数没有自己的this, 它的this是继承而来; 默认指向在定义它时所处的对象(宿主对象),///
21.js数据类型 基本数据类型 Number boolean null undefined String 引用数据类型 object array function22，数据类型检测 typeof，typeof 对于基本数据类型来说，除了 null 都可以显示正确的类型， typeof 对于对象来说，除了函数都会显示 objec Object.prototype.toString.call()可以检测所有数据类型，例如返回的是【Object string】
23，深浅拷贝 浅拷贝的意思就是只复制引用，源对象修改时目标对象也跟着修改。
23.1 浅拷贝使用Object.assign()实现，但是他对对象中一级进行深拷贝，而二级进行浅拷贝， 一级不会因为目标对象的改变而改变，二级会发生改变。原因是源与目标共用同一个内存 23.2 深拷贝使用JSON.parse(JSON.stringify(object)),源不会因为目标对象发生改变而改变 因为深拷贝开辟了新的内存，切断了与源的联系
24，作用域 全局作用域 局部/函数内部作用域 块级作用域（es6通过let或者const，作用域外无法访问）
25，作用域链，执行环境中变量和函数访问的顺序
26，变量声明提升 函数的声明优先级高于变量，var a=20；高于var a=10；只有变量名称被提升， 值没有提升 var a = 10; function fun(){ console.log(a); var a = 20; }fun()
27，闭包，可以访问另一个函数内部变量的函数就叫闭包function F() { let a = 1 function K() { console.log(a) } K(); }F() // 1
28，new操作符做了什么 实例化了一个对象，this指向这个对象 ，把空对象的原型指向构造函数的原型
29，js创建对象的方式 var obj={}； var obj = new Object()
30，call和apply，call和apply都是为了改变函数运行时候的环境 function add(a,b){ alert(a+b); } function sub(a,b){ alert(a-b); } add.call(sub,3,1)//输出为4，add替换掉了sub call和apply第一个参数都是this，call后面传参数，apply后面传入数组 obj.call(arg,aaa,bbb,ccc) obj.apply(arg,[aaa,bbb,ccc])var array1 = [12,‘foo’];var array2 = [‘Doe’,100];Array.prototype.push.call(array1, ‘Doe’,100)Array.prototype.push.apply(array1, array2)
31，this指向(1) 被直接调用时，this指全局对象window。 (2) 被作为构造函数调用时，this指当前正在构建的对象。 new func();(3) 被作为某个对象A的方法调用时，this指方法所属的对象A。 A.func();(4) 使用函数的apply或call方法调用时，this指第一个参数B。
32，数组去重，使用indexOf(),查找的时候如果存在返回的是索引，如果不存在返回的是-1//数组去重 var arr = [2,3,2,4,2,2,3,5,8,7,2]; var arr1 = []; for(var i = 0;i<arr.length;i++){ if(arr1.indexOf(arr[i])<0){ arr1.push(arr[i]); } } console.log(arr1) //出现次数 var obj = {}; for(var i = 0;i<arr.length;i++){ if(obj[arr[i]]){ obj[arr[i]]=obj[arr[i]]+1; }else{ obj[arr[i]]=1; } } console.log(obj); for(var x in obj){ console.log(x+‘出现了’+obj[x]+‘次’) } //冒泡排序 var arr2 = [62,12,8,35,45,89,33] for(var i = 0;i<arr2.length-1;i++){ for(var j = 0;j<arr2.length-1-i;j++){ if(arr2[j]>arr2[j+1]){ var v1 = arr2[j]; arr2[j] = arr2[j+1]; arr2[j+1] = v1; } } }
33，null是对象吗？为什么 null不是对象，虽然typeof(null)是object，但是这只是一个悠久的bug。
34，未知宽高元素垂直居中
一：绝对定位，top：50%；transform：transltate（-50%）
1.1

1.2

二：flex布局，外层盒子有高display：flex；align-items：center；
35，一些输出

//输出
   console.log([]==false)//true
   console.log([]==0)//true
   console.log(![]==0)//true
   console.log([]==![])//true
   console.log(false==0)//true
   console.log(true==1)//true
   console.log({}==false)//false
   if([]){console.log("aa")}//aa
   console.log([1]==[1])//false

36，每隔一段时间执行一个函数一定次数
题目要求是实现一个function repeat (func, times, wait) { }函数，每隔wait毫秒执行func函数times次，调用过程如下：
const repeatFunc = repeat(alert, 4, 3000)
repeatFunc(“hellworld”);
``bash
function repeat(func,times,wait){
return function(content){
console.log(content)
var count = 0;
var interval = setInterval(function(){
count+=1;
func(content);
if(count==times){
clearInterval(interval)
}
},wait)
}
}
// let repeatFunc = repeat(alert,4,3000)
// repeatFunc(“hello”)

37，找出数组中和为指定值的两个数
![在这里插入图片描述](https://img-blog.csdnimg.cn/20200330103830995.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzQ0NzA2NjE5,size_16,color_FFFFFF,t_70)

38，