学习JavaScript高级第十天(原型重定向,new的实现)

it2026-03-11  2

学习JavaScript高级第十天(原型重定向,new的实现)

1、原型重定向

/* * 原型重定向: 为什么要重定向: 为了方便批量给原型上扩充属性和方法 带来的问题: 1、新定向的原型对象上,没有 constructor 属性,结构不完整 2、浏览器默认生成的原型对象会因为缺少被引用而被销毁释放掉,可能导致在重定向之前给原型上添加的属性和方法丢失 !注意:内置类的原型不允许重定向 */ function Fn(){ this.x = 100; } Fn.prototype.getX = function(){ console.log('原型') }; Fn.prototype.z = 300; // Fn.prototype = { // // 原型重定向会丢失 constructor 和重定向之前在原型上添加的属性和方法,所以每次重定向最好是用“合并”的方法 // } let f = new Fn; // f.__proto__ 指向的是Fn的原型,如果Fn的原型变了,那f.__proto__的执行跟着变 // 没有重定向止之前 f.getX(); // 原型 Fn.prototype = Object.assign(Fn.prototype, { getX: function(){ console.log('重定向') } }); // Object.assign(对象1,对象2):合并两个对象,重复的属性和方法以对象2为主,即对于重复的属性和方法,对象2会覆盖对象2的 // 重定向之后 f.getX(); // 重定向

2、new的实现过程

/* * new 的内部做了哪些事: 1、创建一个新的对象 2、让创建的对象的原型链(__proto__)指向当前类的原型(prototype) 第一步和第二步可以联合起来,用Object.create(类)来实现 3、把当前类当做函数执行,并且让函数内的this指向创建的对象 4、接收函数的执行结果,判断其有没有return引用数据类型,如果没有则return创建的对象,否则返回函数执行的结果 */ function Dog(name) { this.name = name; } Dog.prototype.bark = function(){ console.log('wwww'); } Dog.prototype.sayName = function(){ console.log(this.name); } function _new(Fn, ...parms){ // 完成你的代码 // let obj = {}; // obj.__proto__ = Fn.prototype; // IE中不允许操作__proto__ let obj = Object.create(Fn.prototype); // Object.create(对象A):返回一个原型链指向 对象A 的空对象 let res = Fn.apply(obj, parms); console.log( typeof res) if((typeof res !== 'object') && (typeof res !== 'function')) { return obj; } else return res; } let sanmao = _new(Dog, '三毛'); console.log(sanmao); sanmao.bark(); // www sanmao.sayName(); // 三毛 console.log(sanmao instanceof Dog); // true // 实现Object.create Object.create = function(obj) { if(typeof obj !== 'object') { throw new TypeError('类型错误') } function A(){}; A.prototype = obj; return new A; // 最后返回的是一个空对象,因为实例都是对象 }
最新回复(0)