一、内置对象的原型链
1、Object原型
1 function test() {} 2 alert(test.toString()); 3 4 //新增属性 5 Object.prototype.mytest = function() { 6 alert("123"); 7 } 8 var o = new Object(); 9 o.mytest(); 10 11 //重写属性 12 Object.prototype.toString = function() 13 { 14 alert("破坏之王"); 15 } 16 o.toString();
2、Object对象是Function对象的实例
1 /*object的__proto__指向Function对象的原型*/ 2 //Object对象是Function对象的一个实例 3 console.log(Object.__proto__ === Function.prototype);//true 4 5 /*Function.prototype对象的原型的__proto__属性指向Object.prototype*/ 6 console.log(Function.prototype.__proto__ === Object.prototype) 7 8 /*object的原型的__proto__属性为null*/ 9 console.log(Object.prototype.__proto__ ) 10 11 12 /*总结*/ 13 /*一个自定义对象可以访问到Function对象的所有属性和方法,也可以访问到Object对象的所有属性和方法*/
3、内置对象的实例指向
1 //Object对象是Function对象的一个实例 2 //Object对象的__proto__指向Function的原型 3 console.log(Object.__proto__===Function.prototype);//true 4 5 console.log(Object.prototype.__proto__);//null 6 7 console.log(Function.prototype.__proto__===Object);//false 8 console.log(Function.prototype.__proto__===Object.prototype);//true 9 10 //内置对象的_proto_的指向 11 console.log(Number.__proto__ ===Function.prototype);//true 12 console.log(Boolean.__proto__ ===Function.prototype);//true 13 console.log(String.__proto__ ===Function.prototype);//true 14 console.log(Object.__proto__ ===Function.prototype);//true 15 console.log(Function.__proto__ ===Function.prototype);//true 16 console.log(RegExp.__proto__ ===Function.prototype);//true 17 console.log(Error.__proto__ ===Function.prototype);//true 18 console.log(Date.__proto__ ===Function.prototype);//true 19 20 21 //自定义对象的原型的__proto__指向 22 function Product(){}; 23 24 Product.prototype={}; 25 26 var iphone=new Product(); 27 console.log(Product.prototype.__proto__);//object 28 console.log(Product.prototype.__proto__===Object.prototype);//true 29 30 //构造函数就是一个函数,函数都是由Function实现的,都是它的一个实例 31 console.log(Product.__proto__===Function.prototype);//true 32 33 var obj = new Object(); 34 //toString是object的方法,因为在原型中,所以所有对象都可以访问 35 //Object.prototype.toString=function(){}; 36 console.log(obj.toString());//[object Object] 37 38 /*object的实例指向Object的原型对象*/ 39 console.log(obj.__proto__ === Object.prototype);//true
4、自定义对象的原型链
1 //object的__proto__指向的是Function.prototype 2 console.log(Object.__proto__ ===Function.prototype) 3 4 5 /*null*/ 6 console.log(Object.prototype.__proto__); 7 8 9 /*object*/ 10 console.log(Function.prototype.__proto__ === Object) //false 11 console.log(Function.prototype.__proto__ === Object.prototype) //ture 12 13 14 /*内置对象的__proto__指向*/ 15 console.log(Number.__proto__ === Function.prototype) // true 16 /* 17 Boolean.__proto__ === Function.prototype // true 18 String.__proto__ === Function.prototype // true 19 Object.__proto__ === Function.prototype // true 20 Function.__proto__ === Function.prototype //true 21 Array.__proto__ === Function.prototype // true 22 RegExp.__proto__ === Function.prototype // true 23 Error.__proto__ === Function.prototype // true 24 Date.__proto__ === Function.prototype // true*/ 25 26 27 /*自定义对象的原型的__proto__指向*/ 28 function Product(){} 29 30 Product.prototype={} 31 32 var iphone = new Product() 33 34 console.log(Product.prototype.__proto__) 35 console.log(Product.prototype.__proto__ === Object) //false 36 console.log(Product.prototype.__proto__ === Object.prototype) //true 37 38 var obj = new Object() 39 40 /* Object.prototype.toString=function(){ 41 alert(‘破坏之王‘) 42 }*/ 43 44 console.log(obj.toString()) 45 /*构造函数其实就是一个函数 46 函数都是Function实现的。都是它的一个实例*/ 47 48 /* Function 49 Function.prototype 50 Object 51 Object.prototype*/ 52 53 console.log(Product.__proto__ ===Function.prototype); 54 55 console.log(Array.prototype.__proto__ === Object.prototype );
二、其他知识
1、hasOwnproperty
1 var person= function(){ 2 age=1 3 }; 4 5 person.prototype={ 6 name:‘wangshukui‘ 7 }; 8 9 10 var xiaowang = new person(); 11 //实例化之后 重新分配内存 系统会自动屏蔽原型同名 -- 原理 开辟新的空间 12 13 // 14 alert(xiaowang.hasOwnProperty("name"));//false --表明是原型属性 15 16 alert(xiaowang.hasOwnProperty("age")); //false --类属性 17 18 19 //当定义一个实例化属性之后,会自动屏蔽原型属性 20 xiaowang.name=‘小李‘; 21 alert(xiaowang.hasOwnProperty(‘name‘)) //true 22 23 xiaowang.sex=‘nan‘; 24 alert(xiaowang.hasOwnProperty(‘sex‘)) //true
2、isPrototypeOf
判断iphone是否拥有Product的原型属性
1 function Product(){ 2 this.name=‘iphone8‘; 3 this.description=‘手机中的战斗机‘; 4 this.price=7777; 5 this.date=new Date(); 6 this.add = function(){}; 7 } 8 9 Product.prototype={ 10 test:11111, 11 buy:function(){} 12 } 13 var iphone = new Product() 14 console.log(Product.prototype.isPrototypeOf(iphone));//true
3、constructor 查看对象的构造函数
1 //constructor : 查看对象的构造函数 2 3 /*function Aaa(){ 4 } 5 6 var a1 = new Aaa(); 7 8 alert( a1.constructor ); //Aaa 9 10 var arr = []; 11 alert( arr.constructor == Array ); //true*/ 12 13 14 /*function Aaa(){ 15 } 16 //Aaa.prototype.constructor = Aaa; //每一个函数都会有的,都是自动生成的 17 18 //Aaa.prototype.constructor = Array; 19 20 var a1 = new Aaa(); 21 alert( a1.hasOwnProperty == Object.prototype.hasOwnProperty ); //true*/ 22 23 24 /*function Aaa(){ 25 } 26 27 Aaa.prototype.name = ‘小明‘; 28 Aaa.prototype.age = 20; 29 30 Aaa.prototype = { 31 constructor : Aaa, 32 name : ‘小明‘, 33 age : 20 34 }; 35 36 var a1 = new Aaa(); 37 alert( a1.constructor );*/ 38 39 40 function Aaa(){ 41 } 42 43 Aaa.prototype.name = 10; 44 Aaa.prototype.constructor = Aaa; 45 46 for( var attr in Aaa.prototype ){ 47 alert(attr); 48 }
4、instanceof : 对象与构造函数在原型链上是否有关系
1 //instanceof : 对象与构造函数在原型链上是否有关系 2 3 function Aaa(){ 4 } 5 6 var a1 = new Aaa(); 7 8 //alert( a1 instanceof Object ); //true 9 10 11 var arr = []; 12 13 alert( arr instanceof Array );//true
5、静态属性、原型属性和实例属性
1 //对象构造函数 2 function Atest(name){ 3 //私有属性,只能在对象构造函数内部使用 4 var className = "Atest"; 5 //公有属性,在对象实例化后调用 6 this.name = name; 7 //对象方法 8 this.hello = function(){ 9 alert(this.name); 10 alert(this.msg());//使用原型方法扩充的方法可以在类内部使用 11 alert(this.sex);//使用原型方法扩充的属性可以在类内部使用 12 alert(Atest.age);//静态属性调用时格式为[对象.静态属性] 13 } 14 } 15 //类方法 (实际是静态方法直接调用) 位置:Person类的外部 语法格式:类名称.方法名称 = function([参数...]){ 语句行; } 16 Atest.Run = function(){ 17 alert("我是类方法 Run"); 18 } 19 20 21 //原型方法 22 Atest.prototype.msg = function(){ 23 alert("我的名字是:"+this.name);//如果原型方法当作静态方法直接调用时,this.name无法被调用 24 } 25 26 //公有静态属性 在类的外部 27 Atest.age = 20;//公有静态属性不能使用 【this.属性】,只能使用 【对象.属性】 调用 28 29 //原型属性,当作是类内部的属性使用【this.原型属性】,也可以当成公有静态属性使用【对象.prototype.原型属性】 30 Atest.prototype.sex = "男"; 31 32 Atest.Run(); //类方法也是静态方法,可以直接使用 【对象.静态方法()】 33 Atest.prototype.msg();//原型方法当成静态方法使用时【对象.prototype.方法()】 34 alert(Atest.prototype.sex);//原型属性当作静态属性使用时【对象.prototype.方法()】 35 var a = new Atest("zhangsan");//对象方法和原型方法需要实例化对象后才可以使用 36 a.hello();//对象方法必须实例化对象 37 a.msg();//原型方法必须实例化对象 38 alert(a.age)://错误,公有静态属性只能使用 【对象.属性】调用 39 40 //ps:尽量将方法定义为原型方法,原型方法避免了每次调用构造函数时对属性或方法的构造,节省空间,创建对象快.