javascript原型/原型链/call/apply

javascript原型

1. 定义：原型是function对象的一个属性，它定义了构造函数制造出的对象的公共祖先 ，通过该构造函数产生的对象，可以继承该原型的属性和方法，原型也是对象
2. 利用原型的特点和概念可以提取共有属性
3. 对象如何查看原型 隐式属性 proto
4. 对象如何查看对象的构造函数 constructor

原型 构造函数构造出的对象的爷爷 构造函数中this中有隐式的 proto 指向 当构造出的对象在自身或父级找不到属性或属性值时会向爷爷去找 也就是__proto__指向去找

Person.prototype.height = 132;
Person.prototype.lang = 123;
Person.prototype.name = 122;
function Person(){
   // var this = {
   //   __proto__ : Person.prototype
  // }
}
var obj = {
   name : 'Sunny'
}
var person = new Person();

person.__proto__ = obj;

constructor可以理解为找谁是构造出对象的构造期 constructor是可以修改的

function Person(){

}

Car.prototype = {
   constructor : Person
}

function Car(){
}
var car = new Car(); 

原型的两种情况

1. 在构造函数构造完对象之后 修改构造器的prototype 已经构造完成的对象不受影响

Person.prototype.name = 'sunny';
function Person(){
// var this = { __proto__ : Person.prototype}

}

var person = new Person();

Person.prototype = {
   name : ' cherry'
}

2. 在构造函数构造对象之前，修改或覆盖构造器的prototype 此时构造器的prototype已经改变，则构造的对象也跟着改变

Person.prototype.name = 'sunny';
function Person(){
// var this = { __proto__ : Person.prototype}

}
Person.prototype = {
   name : ' cherry'
}
var person = new Person();

javascript原型链

原型链是什么？ 原型链就是原型里隐式的__proto__一层一层的链接
当构造对象在自身无法找到某些属性或属性值 会顺着原型链一路找上去，会一直坚持不懈的直到到达Objext原型，若还未找到则为undefined

Grand.prototype.lastName = 'Deng ';

function Grand(){

}
var grand = new Grand();

Father.prototype = grand;
function Father(){
    this.name = 'xuming';
}
var father = new Father();

Son.prototype = father ;
 function Son(){
     this.hobbit = 'smoke';
}
var son = new Son();

原型链基本上不能直接通过子系来修改父级的属性 但可以通过引用值来修改

Grand.prototype,lastName = 'Deng ';

function Grand(){

}
var grand = new Grand();

Father.prototype = grand;
function Father(){
    this.name = 'xuming';
    this.fortune = {
        card1 : 'visa'
    }

}
var father = new Father();

Son.prototype = father ;
 function Son(){
     this.hobbit = 'smoke';
}
var son = new Son();

son.fortune.card2  = 'clid';

a.sayName() sayName里面的this 指向是，谁调用的这个方法，this就指向谁

Person.prototype = {
    name : 'a',
    sayName : function(){
        console.log(this.name);
    }
}
function Person(){
    this.name = 'b';
}
var person = new Person();

create原型

通过Object.create（Object or null） 可以制定对象创将的原型

Person.prototype.name = 'sunne';
function Person(){

}
var person = Object.create(Person.prototype)

var obj = Object.create(null);

javascript 可正常计算的范围，小数点前16位 后16位

绝大多数对象的最终都会继承自Object.prototype

有例外 Object.create(null) 为空 什么都没有 也没有继承Object.prototype

toString

undefined 和 null 没有toString属性 数字字符串布尔对象都有 因为它们会经过包装类一层一层往上包装
document.write(obj); 先调用toString方法 然后打印 如果obj没有toString方法 则会出错
document.write(obj); --> document.write(obj.toString());

var obj = Object.create(null);
obj.toString = function(){
    return '好好';
}
document.write(obj);

call/apply

call/apply 都是用来改变this指向的 不同点在于 call 需要把实参按照形参的个数依次传进去 apply 需要传一个arguments

function Person(name ,age){
    // this  == obj
    this.name = name ;
    this.age = age;
}
var person = new Person('deng',100)
var obj = {

}
Person.call(obj,'cheng',300);

通过改变this指向来使用别人的东西

function Person(name,age,sex){
    this.name = name ;
    this.age = age;
    this.sex = sex;
}
function Student(name,age,sex,tel,grade){
    Person.call(this,name,age,sex);
    this.tel = tel;
    this.grade = grade;
}
var student = new Student('sunny',123,'male',139,2017);

function Wheel(whellSize,style){
    this.style = style ;
    this.whellSize = whellSize;
}

function Sit(c,sitColor){
    this.c = c;
    this.sitColor = sitColor;
}
function Model(height,width,len){
    this.height = height;
    this.width= width;
    this.len= len;
}
function Car(whellSize,style,c,sitColor,height,width,len){
    Wheel.call(this,whellSize,style);
    Sit.call(this,c,sitColor);
    Model.call(this,height,width,len);    
}
var car = new Car(100,'ers','wer','red',1800,2300,2311);

原文地址：https://www.qianqianhaiou.cn/index.php/archives/57/