js-原型

原型prototype其实就是function对象的一个属性,它也是一个对象

这个prototype是定义构造函数构造出的每个对象的公共祖先.

所有被该构造函数构造出来的对象都可以继承原型上的属性和方法


function MobilePhone (color, brand) {
  this.color = color;
  this.brand = brand;
}
MobilePhone.prototype.rom = '64G'
MobilePhone.prototype.som = '4G'

var phone1 = new MobilePhone('red','huawei')
var phone2 = new MobilePhone('green','iphone')
// 如果函数中有就使用,没有的话,就去原型中找
console.log(phone1.rom);  // 64G
console.log(phone2.som);  // 4G

CRUD

function MobilePhone () {}
MobilePhone.prototype.name = '张三';
var phone1 = new MobilePhone();
phone1.name = '李四';
phone1.age = 18;
console.log(MobilePhone.prototype.age);   // undefined  通过实例化对象往到构造函数里添加是不行的
console.log(MobilePhone.prototype.name);  // 张三 通过实例化对象更改自己的祖先是不行的

delete phone1.name
console.log(MobilePhone.prototype.name); // 张三 通过实例化对象删除自己的祖先是不行的

constructor 指向是可以更改的

function A(){}
console.log(A.prototype);   // A()
function B(){}
A.prototype = {
  constructor: B
}
console.log(A.prototype);   // B()


function Car() {}
Car.prototype.name = 'Benz';
var car1 = new Car()
console.log(car1);  
// Car {  __proto__ : name: Benz  }

// 说明: 当Car构造函数被实例化的时候,隐式的产生了this,this默认有一个__proto__,
// 这个__proto__里边默认装上了实例化对象的原型.
// function Car() {  // 这里this就是实例化car1
//   var this = {
//     __ptoto__ :Car.prototype // __proto__是实例化对象后才有的,它属于实例化对象,每一个实例化对象都有一个__proto__;
//                              // prototype原型属于实例化对象,而不属于构造函数
//   }
//  }

__proto__是可以更改的

function Person() {}
Person.prototype.name = '张三'
var p1 = {
  name: '李四'
}
var person = new Person()
console.log(person.name);  // 张三

person.__proto__ = p1;

console.log(person.name);  // 李四


var obj = Object.create(null)
var obj2 = {
  count: 2
}
obj.__proto__ = obj2     // __proto__必须是系统内置的,可以更改但不能自己造

console.log(obj.count);  // undefined


​
function Car() {}
Car.prototype.name = 'mazda'
var car1 = new Car()
Car.prototype.name = 'BYD'
console.log(car1.name);  // BYD  属性的重写


function Car() {}
Car.prototype.name = 'mazda'
var car1 = new Car() // 注意: 实例化之后跟现在对应的的prototype没关系
Car.prototype = {  // 保存到constructor里
  name : 'BYD'
}
console.log(car1,car1.name);  // mazda

// 隐式转化为:
// function Car() {
//   var this = {
//     __proto__: Car.prototype = {
//       name: 'mazda'
//     }
//   }
// }


function Car() {}
Car.prototype.name = 'mazda'
Car.prototype = {  // 保存到constructor里
  name : 'BYD'
}
var car1 = new Car() // 注意: 实例化之后跟现在对应的的prototype没关系

console.log(car1.name);  // BYD

原型链

原型链的顶端是Object.prototype


function Teacher() {
  this.age = 18
  this.success = {
    alibaba: '28',
    tenXun: '100'
  }
}
var teacher = new Teacher()


Student.prototype = teacher;
function Student() {}
var student = new Student()
student.success.baidu = '99'
student.age++
console.log(teacher,student);  // 引用类型可以修改父级的属性, 原始类型不能修改,但是不推荐修改



function Car() {
  this.brand = 'Benz'
}
Car.prototype = {
  brand : 'Mazda',
  intro: function() {
    console.log(this.brand);  
  }
}
var c = new Car() 
c.intro() // Benz 当前this指向c
Car.prototype.intro() // Mazda 当前this指向Car.prototype

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值