四月份面试题汇总（一）
1.理解原型、原型链？
每创建一个函数，函数上都有一个prototype的属性，他是一个对象。这个对象的作用就是当使用它创建实例的时候，这些实例都会共享原型上的属性和方法。 当我们访问对象中的某个属性时，如果这个对象内部不存在这个属性，那么他就会去__proto__里面去找这个属性，这个__proto__又会有自己的__proto__， 就这么一直找下去直到最后一个__proto__值为null。
var A = function(){};
var a = new A();
console.log(a.__proto__); //A {}（即构造器function A 的原型对象）
console.log(a.__proto__.__proto__); //Object {}（即构造器function Object 的原型对象）
console.log(a.__proto__.__proto__.__proto__); //null2. __proto__和prototype的关系？
__proto__是每个对象都有的一个属性，而prototype是函数才会有的属性。
举例：var p = new Person();
其中p.__proto__ == Person.prototype。3. 如何鉴别属性是自有属性还是原型属性？
hasOwnProperty()方法返回true即为自有属性，返回false有两种可能
- 1.为原型属性；
- 2.跟本不存在该属性
所以判断是否是原型属性，要先用in判断该对象中是否存在此属性：
function hasPrototypeProperty(obj, name){
return name in obj && !obj.hasOwnProperty(name);
}4.如何判断某个对象是否是另一个对象的原型对象？
isPrototypeOf()；
例：function Cat(name,color){}
var cat1 = new Cat();
alert(Cat.prototype.isPrototypeOf(cat1)); //true5. ES6箭头函数注意点 ？
- 1.函数体内的this，是定义时所在的对象，而不是使用时所在的对象，始终指向自身外的第一个this。
- 2.不可以做构造函数，也就是说不可以使用 new 命令，否则会抛错。
- 3.不可以使用arguments对象，不存在，可以使用Rest代替。
使用Rest：
var foo=(...arguments)=> {console.log(arguments);
}6. 让你开始一个项目，你会选择用 vue 还是 React？
- 1如果你喜欢用模板搭建应用，请使用 vue。
- 2如果你的应用需要尽可能小和快，请使用 vue。
- 3如果你计划构建一个大学型应用，请使用 React。
- 4如果你想要同时适用于Web端和原生App的框架，请使用 React。
- 5如果你想要更大的生态圈（论坛等），请使用 React。
7. React创建组件的三种方式及其区别 ？
- 1.函数式定义（无状态组件）：function 组件名(props,/context/){}
- 2.ES5之var 组件名= React.creatClass({})
- 3.ES6之class 组件名 extends React.Components{}
8. React 中 keys 的作用是什么 ？
keys 是用于追踪哪些元素被修改、被添加、被删除的辅助标识。在开发过程中，需要保证某个元素的 key 在其同级元素中具有唯一性。
9. 为什么接下来这段代码不是 IIFE(立即调用的函数表达式)？
function foo(){ }()；以function关键字开头的语句会被解析为函数声明，而函数声明是不允许直接运行的。 只有当解析器把这句话解析为函数表达式，才能够直接运行，
解决1.
(function foo(){
// code..
})()
解决2.
var foo = function(){};
foo();10. js中如何判断null和undefined ？
if(typeof(a)=="undefined"){
console.log('undefined')
}
if(typeof(a)!="undefined"&&a!=0&&!a){
console.log('null')
}11. 实现一个数组乱序排列 ？
var a = [1, 2, 3, 5, 4];
function fn(a, b) {
return Math.Random() - 0.5
}
a.sort(fn);//[5,1,2,4,3]
var a = [1, 2, 3, 5, 4];
function fn(a, b) {
return a - b
}
a.sort(fn);//[1, 2, 3, 4, 5]
var a = [1, 2, 3, 5, 4];
function fn(a, b) {
return b - a
}
a.sort(fn);//[5, 4, 3, 2, 1]js如何区分数组还是对象 ? (代表：实现深拷贝函数)
第一种：Object.prototype.toString.call(a).slice(8,-1) == 'Array' ? [] : {}
var a = {};
Object.prototype.toString.call(a);//"[object Object]"
var a = [];
Object.prototype.toString.call(a);//"[object Array]"第二种：
var a=[];
var b={};
typeof a === 'object' && !isNaN(a.length)//true
typeof b === 'object' && !isNaN(b.length)//false第三种：
var a=[];
var b={};
Array.isArray(a);//true
Array.isArray(b)//false实现一个深拷贝函数：
function clone(obj) {
if(typeof(obj)=='object'&&obj){//&&obj是排除obj=null
//区分是数组还是对象，建立空数组或空对象
var o = Array.isArray(obj) ? [] : {};
for(var k in obj) {
if(typeof(obj[k])=='object'){
o[k] = clone(obj[k]);
}else{
o[k] = obj[k];
}
}
}else{
return obj;
}
return o;
}...
微信公众号：前端实习日记