以下代码执行后,a.x 和 b.x 的结果分别为()
function A(x){ this.x = x; } A.prototype.x = 1; function B(x){ this.x = x; } B.prototype = new A(); var a = new A(2), b = new B(3); delete b.x;
ref:
function A(x){ this.x = x; } A.prototype.x = 1; //将A的prototype.x赋值为1 //什么是protytype,也就是JS中的原型链机制,当读取A中的x时,如果A中找不到,则通过原型链去查找X //在去new一个对象的时候会继承这个原型链 function B(x){ this.x = x; } B.prototype = new A(); //将B的原型链指向A,也就是B.prototype = {x:undefined} var a = new A(2), b = new B(3); delete b.x; //最后结果中a.x,可以直接取到 //而b.x原本为3后来被删去,则进入原型链查找,为undefined
运行一下代码检验一下结果
console.log(a.x); // 2 console.log(b.x); // undefined
function A(x){ this.x = x; } A.prototype.x = 1; function B(x){ this.x = x; } B.prototype = new A(); var a = new A(2), b = new B(3); delete b.x; //这里删除了B实例的x,会在原型链中找即 new A() 的存在x且是andefined,并不会接着想上找到A.prototype.x = 1
function A(x){ //构造函数A this.x = x; } A.prototype.x = 1; //A.prototype = { x: 1 } function B(x){//构造函数B this.x = x; } B.prototype = new A(); //B.prototype = { x: undefinded } //如果new A()传入参数,那么x才不会是undefinded var a = new A(2), // a = { x: 2 } b = new B(3); // b = { x: 3 } delete b.x;//删除掉对象b下的x属性,那么 b = { } //以上过程结束后: // a.x = 2 // b.x 先去b = {}里找,没有的话去 b的构造函数的原型 里找, // 也就是B.prototype = { x: undefinded } 里面找 // 可得 b.x = undefinded
本人对于所遇面试题进行了详细的知识点拆解与梳理,在此分享给大家,有错欢迎指出讨论,求共同进步 --> JavaScript专项练习
- 原型与原型链相关知识点,此部分不太熟悉的同学可以看本人笔记 --> JavaScript进阶笔记的原型链部分
- 如果有x但是没有赋值,则是undefined,相当于x=undefined. 就不会进入原型链
function A(x){ this.x = x; } A.prototype.x = 1; //将A原型上的x设置为1 function B(x){ this.x = x; } B.prototype = new A(); //将B原型上的x设置为 A的一种object. 所以B实例出来object的prototype就是{x:undefined} var a = new A(2),//a.x首先要在自己的构造函数中查找,没有采取原型上找,这里有this.x = x.所以a.x = 2; b = new B(3);//此时 b.x = 3 ;但是因为上面[B.prototype = new A()],所以形成原型链,其父级prototype={x:undefined} delete b.x; //删除实例b上的[x]属性,但是delete只能删除自己的x不能删除父级的x. console.log(a.x,b.x)
- var a = new A(2) 很容易理解,就是 a.x==2
- 看上面代码可以得知,在进行到 b = new B(3) 这步的时候 b的原型 prototype={x:undefined}
- delete b.x; 删除实例b上的[x]属性,但是delete只能删除自己的x不能删除父级的x. 所以我们查看b.x时会走到b的原型上就是 {x:undefined} 这里也是很容易踩到的陷阱,只要有这个属性,即便是undefined也不会在原型上再往上找了
选择 2, 1 选项的同学就是踩到陷阱咯
- B的prototype=new A(), 想错的可能都认为构造函数的 [ x ] 没有传值进去,this.x赋值为undefined, 所以还会去A的prototype原型上找,找到 x = 1 -->错误
- 实际上是:如果构造函数 没有x 才会去原型下找
- 如果有x但是没有赋值,则是undefined,相当于x=undefined. 就不会进入原型链了
function A(x) { this.x = x; } A.prototype.x = 1; function B(x) { this.x = x; } B.prototype = new A(); // p的原型是A对象的实例,因为A实例上没有传参x,所以输出undefined var a = new A(2), b = new B(3); delete b.x; console.log(a.x); // 2 console.log(b.x); // undefined //扩展1 function A(x) { this.x = x; } A.prototype.x = 1; function B(x) { this.x = x; } B.prototype = new A(5); //实例传参 var a = new A(2), b = new B(3); delete b.x; // 删除了对象本身的3,就去原型上找,找到了new A() 找了5 console.log(a.x); // 2 console.log(b.x); // 5 //扩展2 function A(x) { this.x = x; } A.prototype.x = 1; function B(x) { this.x = x; } B.prototype = A.prototype; // 共享同一原型 var a = new A(2), b = new B(3); delete b.x; // 删除了对象本身的3,就去原型上找,找到了A.prototype 找了1 console.log(a.x); // 2 console.log(b.x); // 1
function A(x){ this.x = x; } A.prototype.x = 1; function B(x){ this.x = x; } B.prototype = new A(); var a = new A(2), b = new B(3); delete b.x;