js原型式继承问题

Question

//原型式继承
function inheritObject(o) {
  //声明一个过渡函数对象
  function F() {
    //过渡对象的原型继承父对象
      F.prototype = o;
  }
  //返回过渡对象的一个实例，该实例的原型继承了夫对象
  return new F();
}

//测试

let book = {
  name: 'js books',
  alikeBook: ['css book', 'html book']
};

let newBook = inheritObject(book);
newBook.name = 'ajax book';
// newBook.alikeBook.push('xml book');

console.log(newBook.name);           //ajax book
console.log(newBook.alikeBook);      //undefined

console.log(book.name);              //js books
console.log(book.alikeBook);         //['css book', 'html book']

想问一下，问什么newBook.alikeBook是undefined？

Answer 1

按照楼上的方法，可以使你的代码实现预期的功能。我这里解释下为什么你这么写不能得到预期的效果。

这里需要说下new操作符的一个执行流程

1.创建一个object
instance = new Object();
2.设置原型链
instance.__proto__ = F.prototype;
3.将上下文this指向instance,执行函数体
F.apply(instance, arguments);
4.返回值

所以，可以看到，设置原型链的操作是在第二步的时候的执行的，而这个时候，你代码里面的F.prototype = o还没有执行，所以instance.__proto__只会被赋值undefined，自然就没有达到继承的效果

Answer 2

F.prototype = o;原型指向放到构造函数里面去有点绕啊。

function inheritObject(o) {
  //声明一个过渡函数对象
  function F() {
    
  }
  //过渡对象的原型继承父对象
  F.prototype = o;//这句不要放到F构造函数里面去

  //返回过渡对象的一个实例，该实例的原型继承了夫对象
  return new F();
}

Answer 3

相关问题

Answer 4

程序写错了。
定义：

 F.prototype = o;

的地方不应该在F函数内。

因为在new一个构造函数的时候，是先初始化F，再执行F里的代码，然而初始化的过程：
1、newbook = {}
2、newbook.__proto__ = F.prototype
3、F.apply(newbook)
在赋予newbook原型链的时候，F的原型是空，并没有赋值，所以结果是undefined，此时原型链是
F.prototype(空) => Object.prototype => null

函数修改如下：

function inheritObject(o) {
          
            function F() {

                
            }
            F.prototype = o;
            return new F();
        }

应该可以了