JS:原型链、原型链的查找、原型链的遮蔽效应、原型链的终点、关于数组的原型链

发布时间:2022-06-26 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了JS:原型链、原型链的查找、原型链的遮蔽效应、原型链的终点、关于数组的原型链脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

JS:原型链、原型链的查找、原型链的遮蔽效应、原型链的终点、关于数组的原型链

一、原型链 1、原型链: 每个对象都可以有一个原型_proto_,这个原型还可以有它自己的原型,以此类推,形成一个原型链。查找特定属性的时候,我们先去这个对象里去找,如果没有的话就去它的原型对象里面去,如果还是没有的话再去向原型对象的原型对象里去寻找… 这个操作被委托在整个原型链上,这个就是我们说的原型链了。 2 prototype和constructor

  • prototype属性,它是函数所独有的,它是从一个函数指向一个对象。
  • 每个函数都有一个原型对象,该原型对象有一个constructor属性,指向创建对象的函数本身。

JS:原型链、原型链的查找、原型链的遮蔽效应、原型链的终点、关于数组的原型链

3.构造函数的prototype属性是它的实例的原型

JS:原型链、原型链的查找、原型链的遮蔽效应、原型链的终点、关于数组的原型链

function People(name, age, sex){
    this.name = name;
    this.age = age;
    this.sex = sex; 
}
//实例化
var xiaoming = new People('小明', 12, '男');
//测试三角关系是否存在
console.log(xiaoming.__proto__ === People.prototype);
//true

二、原型链查找 JavaScript规定:实例可以打点访问它的原型的属性和方法,这被称为“原型链查找”

function People(name, age, sex) {
    this.name = name;
    this.age = age;
    this.sex = sex;
}
// 往原型上添加nationality属性
People.prototype.nationality = '中国';

var xiaoming = new People('小明', 12, '男');

console.log(xiaoming.nationality);      // 中国
console.log(xiaoming);

JS:原型链、原型链的查找、原型链的遮蔽效应、原型链的终点、关于数组的原型链

三、原型链遮蔽

function People(name, age, sex) {
    this.name = name;
    this.age = age;
    this.sex = sex;
}
// 往原型上添加nationality属性
People.prototype.nationality = '中国';

// 实例化
var xiaoming = new People('小明', 12, '男');
var tom = new People('汤姆', 10, '男');
tom.nationality = '美国';

console.log(xiaoming.nationality);      // 中国
console.log(xiaoming);

console.log(tom.nationality);           // 美国
//tom本身有nationality时,就不找原型上的nationality属性了,原型链的遮蔽效应
//跟局部变量全局变量差不多

四、原型链的终点

JS:原型链、原型链的查找、原型链的遮蔽效应、原型链的终点、关于数组的原型链

People.prototype是对象,因为object是所有对象的构造函数,那么这个对象就是object的实例,可以看做是object new出来的,构成了三角关系

那么小明就可以顺着原型链寻找到定义在原型链终点的这个对象上的方法

function People(name, age){
	this.name = name;
    this.age = age;
}
var xiaoming = new People('小明', 12);

console.log(xiaoming.__proto__.__proto__ === Object.prototype);  //true
console.log(Object.prototype.__proto__);      // null 说明是原型链终点

var char = xiaoming.toString();
console.log(char);

console.log(Object.prototype.hasOwnProperty('hasOwnProperty'));  //true
console.log(Object.prototype.hasOwnProperty('toString'));   //true
//说明hasOwnProperty和toString都是定义在Object.prototype上的

五、关于数组的原型链

JS:原型链、原型链的查找、原型链的遮蔽效应、原型链的终点、关于数组的原型链

var arr = [344, 45, 34, 23]; //一个普通数组

console.log(arr.__proto__ === Array.prototype);                 // true
console.log(arr.__proto__.__proto__ === Object.prototype);      // true
console.log(Array.prototype.hasOwnProperty('push'));            // true
console.log(Array.prototype.hasOwnProperty('splice'));          // true

脚本宝典总结

以上是脚本宝典为你收集整理的JS:原型链、原型链的查找、原型链的遮蔽效应、原型链的终点、关于数组的原型链全部内容,希望文章能够帮你解决JS:原型链、原型链的查找、原型链的遮蔽效应、原型链的终点、关于数组的原型链所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。
标签: