深度测试题

一个原型题（注意我做错的部分）

const foo = {}
const f = function() {}
Function.prototype.a = 'value a'
Object.prototype.b = 'value b'
console.log(foo.a, foo.b, f.a, f.b)
console.log('undefined','b',"a",undefined)


//实际结果
//undefined "value b" "value a" "value b"
VM208:6 undefined b a undefined

剩下一个题也做错了（非常重要）

function Person(name) {
    this.name = name
    return name;
}
let p = new Person('Tom');
//实例化Person过程中，Person返回什么（或者p等于什么）？
//答案：{name: 'Tom'}

//若将题干改为
//function Person(name) {
    this.name = name
    return {}
}
let p = new Person('Tom');
//实例化Person过程中，Person返回什么（或者p等于什么）？
//答案 {}

//构造函数不需要显示的返回值。使用new来创建对象(调用构造函数)时，如果return的是非对象(数字、字符串、布尔类型等)会忽而略返回值;如果return的是对象，则返回该对象(注：若return null也会忽略返回值）。

  typeof和instanceof的区别？

//在 JavaScript 中，判断一个变量的类型尝尝会用 typeof 运算符，在使用 typeof 运算符时采用引用类型存储值会出现一个问题，无论引用的是什么类型的对象，它都返回 “object”。

//instanceof 运算符用于检测构造函数的 prototype 属性是否出现在某个实例对象的原型链上。

 new和instanceof的内部机制

new有四步骤：

1.创建一个新对象

2.把构造函数的作用域指向新对象（因此this就指向这个新对象）

3.执行构造函数的代码，为新对象（添加属性）【如果代码中有return非对象，则返回这个新对象内的内容】

//有return  函数结束 但是返回之前新创建的对象 ，

function Inherit(inherit, name) {
    this.inherit= inherit
    return name
    this.name = name
}
let inherit = new Inherit('a','b')
console.log(inherit)
VM64:7 Inherit {inherit: "a"}

如果代码中有return对象，则返回这个对象内的内容

function Inherit(inherit, name) {
    this.inherit= inherit
    return {aa:'aa'}
    this.name = name
}
let inherit = new Inherit('a','b')
console.log(inherit.name)
VM69:7 undefined

//返回全新对象 与构造函数无关

 

4.返回这个新对象

用代码来阐述

// let p = new Person()
let p = (function () {
    let obj = {};
    obj.__proto__ = Person.prototype;
    
    // 其他赋值语句...
    
    return obj;
})();

下面通过代码阐述instanceof的内部机制，假设现在有 x instanceof y 一条语句，则其内部实际做了如下判断

while(x.__proto__!==null) {
    if(x.__proto__===y.prototype) {
        return true;
    }
    x.__proto__ = x.__proto__.proto__;
}
if(x.__proto__==null) {return false;}

x会一直沿着隐式原型链__proto__向上查找直到x.__proto__.__proto__......===y.prototype为止，如果找到则返回true，也就是x为y的一个实例。否则返回false，x不是y的实例

使用过flex布局吗？flex-grow和flex-shrink属性有什么用？

答案： flex-grow：项目的放大比例，默认为0，即如果存在剩余空间，也不放大。flex-shrink：项目的缩小比例，默认为1，即如果空间不足，该项目将缩小。

 17.数组扁平化处理：实现一个flatten方法，使得输入一个数组，该数组里

面的元素也可以是数组，该方法会输出一个扁平化的数组。

// Example
let givenArr = [[1, 2, 2], [3, 4, 5, 5], [6, 7, 8, 9, [11, 12, [12, 13, [14]]]], 10];
let outputArr = [1,2,2,3,4,5,5,6,7,8,9,11,12,12,13,14,10]

// 实现flatten方法使得
flatten(givenArr)——>outputArr

//年轻的我是用递归实现的QAQ，我的答案
function flatten(arr){
    var res = [];
    for(var i=0;i<arr.length;i++){
        if(Array.isArray(arr[i])){
            res = res.concat(flatten(arr[i]));
        }else{
            res.push(arr[i]);
        }
    }
    return res;
}

//2
function flatten(arr){
    return arr.reduce(function(prev,item){
        return prev.concat(Array.isArray(item)?flatten(item):item);
    },[]);
}

//3
function flatten(arr){
    while(arr.some(item=>Array.isArray(item)){
        arr = [].concat(...arr);
    }
    return arr;
}

18.如果在17问的前提下，要做去重和排序处理又该怎么做（不用给出具体代码）。

**答案：**最好封装一个数组方法的类，该类包含flatten(扁平化)、sort(排序)和unique(去重)等方法。

 

function F() {}
function O() {}

O.prototype = new F();
var obj = new O();

console.log(obj instanceof O); // true
console.log(obj instanceof F); // true
console.log(obj.__proto__ === O.prototype); // true
console.log(obj.__proto__.__proto__ === F.prototype); // true

 

function F() {}
function O() {}

var obj = new O();
O.prototype = new F();


console.log(obj instanceof O); // false
console.log(obj instanceof F); // false
console.log(obj.__proto__ === O.prototype); // false
console.log(obj.__proto__.__proto__ === F.prototype); // false

 

原型被重写了，obj在重写之前实例化的 所以obj指向的还是之前的原型

function F() {}
function O() {}

var obj = new O();
let a = O.prototype
let b = F.prototype
O.prototype = new F();
console.log(obj instanceof O); // false
console.log(obj instanceof F); // false
console.log(obj.__proto__ === O.prototype); // false
console.log(obj.__proto__.__proto__ === F.prototype); // false
console.log(obj.__proto__ === a); // true
console.log(O.prototype.__proto__ === F.prototype); // true