您好,欢迎访问代理记账网站
  • 价格透明
  • 信息保密
  • 进度掌控
  • 售后无忧

prototype 原型

prototype 原型

  • 一、了解对象的创建方式
  • 二、原型
  • 三、原型链

一、了解对象的创建方式

1、内置的构造函数创建

var o1=new Object();

2、字面量创建

var o2={};

3、自定义构造函数创建

构造函数的基本使用:

  1. 和普通函数一样,只不过调用的时候需要和new连用,不然就是一个普通的函数调用
  2. 命名规范:首字母大写,驼峰式命名
  3. 构造函数内部的this,由于和new连用的关系,指向的是当前的实例化对象
  4. 构造函数会自动返回一个对象,所以构造函数内部不需要写return
function Ball(_width,_color){
		this.width=_width;
		this.color=_color;
		this.play=function(){
			console.log('play')
		}
	}
	var b1=new Ball(50,"#ccc")

二、原型

一个对象上不仅有属性,还有方法,当我们使用构造函数new一个对象的时候,执行一次就会创建一个新的对象空间,这个对象的函数方法会被创建了很多次,相同的函数出现多次,占用多个空间,显然是不应该的,而prototype(原型)就是解决这个问题的,也就是给我们提供了一个科学的给对象添加函数的方法。

prototype

  • 每个函数都有一个属性prototype,是一个对象空间
  • 可以通过函数名来访问这个prototype

__proto__

  • 每个对象都有一个成员__proto__,是一个对象空间
  • 对象的__proto__里面的内容,对象可以直接使用
  • 当你访问对象中的成员时,如果这个对象自身有这个成员,那么直接返回结果,如果没有,就去__proto__这个空间里面去找
  • 这个对象是由哪个构造函数new出来的,那么这个对象的__proto__就指向该构造函数的原型prototype

实例对象的__proto__和构造函数的prototype引用地址是相同的,那么我们可以向构造函数的prototype属性中添加成员,对象在访问的时候自己没有该成员,就会自动向__proto__中查找。

我们可以把函数放在构造函数的prototype中,那么我们之前构造函数的缺点就可以解决了。

结论:当我们写构造函数的时候,属性直接写在构造函数里,函数写在原型上

三、原型链

一个对象的构造函数constructor

每个对象都有一个自己所属的构造函数。
比如数组(数组本身也是一个对象),var arr=new Array(); 数组所属的构造函数就是Array。
比如函数,var fn=new Function(); 函数所属的构造函数就是Function。

对象的__proto__里有一个成员叫做constructor,这个属性就是指向当前这个对象所属的构造函数

原型链

构造函数的prototype是一个对象,而每个对象都有一个__proto__的属性,那么构造函数的prototype里面的__proto__指向又是哪里?

当一个对象的我们不知道准确的是谁构造的时候,我们就把它看做是Object的实例化对象,也就是说,一个对象的构造函数的prototype中的__proto__属性指向Object.prototype,那么Object.prototype中的__proto__又指向哪里呢?

因为Object是js中的顶级构造函数,也就是js中的万物皆对象,所以Object.prototype就到顶了,Object.prototype的__proto__就是null。

原型链的访问原则

访问一个对象的时候,自己没有就会去__proto__中查找,如果还没有,继续向上一层的__proto__中查找,一致查找到Object.prototype里面都没有,就会返回undefined

例如:以arr这个对象开始的原型链,箭头表示__proto__的意思

arr --> Array.prototype --> Object.prototype --> null


分享:

低价透明

统一报价,无隐形消费

金牌服务

一对一专属顾问7*24小时金牌服务

信息保密

个人信息安全有保障

售后无忧

服务出问题客服经理全程跟进