JavaScript -- prototype和constructor 、原型链

news/2024/7/19 15:07:27 标签: js, 原型链, prototype

construct:对象属性,返回创建此对象的构造函数

prototype:对象属性,使得有能力向对象添加属性和方法。

先来看一个例子:

function Dog(name){    

   this.name = name;

   this.species = "犬类"

}

var a = new Dog("cc")
var b = new Dog("aa")

# 这两个实例对象的species属性是独立的,修改其中一个,不会影响到另一个

a.species = '猫科'   

console.log(b.species)           // "犬类"

为什么会有了prototype属性??prototype 是什么??

  1.每次创建实例对象均会产生相同的species属性,造成资源浪费,于是就给构造函数设置了prototype属性。

  2.prototype属性包含一个对象(以下简称为prototype对象)相当于是一个共有容器,存放实例对象共享的属性和方法。

  3.实例对象一旦创建,将自动引用prototype对象的属性和方法。


于是改进之后:

function Dog(name){

   this.name = name;

}

Person.prototype = { species : “犬类”}

var a = new Dog(“cc”)

var b = new Dog(“aa”)

以下这张图能帮助理解:

     1.构造函数Dog有属性prototype,指向prototype对象。

     2.由构造函数实例化出来的d对象有一个_proto_属性也指向创造d对象的函数对象的prototype对象。(有点绕多读几遍)

     3.construct返回创建此对象的构造函数,所以prototype对象指向了对应的构造函数Dog

结合以上图,在看一个例子:

function Dog() { }    // 创建一个构造函数

var d = new Dog()      // 创建实例

console.log(d.__proto__ === Dog.prototype);  // true

console.log(Dog.prototype.constructor);  // f Dog(){}

js中万物皆对象,出于好奇心,我有console.log了一下

console.log(Dog.__proto__ === Function.prototype)  // true

console.log(Dog.constructor === Function);  // true

这说明什么? 说明构造函数可以看出是Function实例化对象

再来:

console.log(Function.__proto__ === Function.prototype)  // true

console.log(Object.__proto__ === Function.prototype)   // true

1.为什么Object.__proto__指向Function.prototype?

    Object是函数对象,是通过new Function()创建的...

2.为什么Function.__proto__指向Function.prototype 

   Function也是对象函数,也是通过new Function()创建

由此可知:各种函数之间存在着创建和被创建的关系,就像链条一下,于是就引出了原型链

原型链就是通过__proto__串起来直到Object.propotype.__proto__为null的链(很难理解看一下图就明白了)

  看图之前先结合以上几点说明:

         1. 构造函数Dog、Object、Function是通过new Function()创建的,所以才有

                    console.log(Dog.__proto__ === Function.prototype) // true

                    console.log(Object.__proto__ === Function.prototype) // true

                    console.log(Function.__proto__ === Function.prototype) // true

          2. 构造函数Dog、Function对应的原型对象由Object创建,所以有

                     console.log(Dog.prototype.__proto__ === Object.prototype); // true

                     console.log(Function.prototype.__proto__ === Object.prototype) // true

           3. Objectd的原型对象的__proto__ 为null

  最后上图:

      注意:图中矩形表示函数对象,椭圆形表示普通对象,只有函数对象才有prototype属性(重要的事情说三遍!!!)

 


http://www.niftyadmin.cn/n/1509687.html

相关文章

struts2 拦截器【转】

看了浪曦的STRUTS2的视频之后,才发现拦截器是多么滴好用,以下是转载内容:拦截器的作用主要就是拦截东西,拦截什么呢?当然是action了,在执行action之前 拦截器会起作用,执行一些预先处理的代码&a…

python基础 - 数据类型

数据结构:计算机程序中有很多数据,这些数据需要一个容器来管理。 常见:数组,集合,列表,队列,链表,树,堆,栈,字典等 Python中的数据结构主要是序…

iOS-沙盒路径

iphone沙箱模型的有四个文件夹,分别是什么,永久数据存储一般放在什么位置,得到模拟器的路径的简单方式是什么.documents,tmp,app,Library。(NSHomeDirectory())手动保存的文件在documents文件里Nsuserdefau…

python基础 - 序列(list、str、tuple)

1.列表 (有序、可变序列,列表的所有元素放在一对中括号“[]”中,并使用逗号分隔开) 1.1 列表生成方式: (1) [1,2,3,xx,(1,2),{name:cc}] 列表中可以存放各种数据类型 (2&…

mysql 格式化 小数点后两位_mysql格式化小数保留小数点后两位(小数点格式化)

复制代码 代码如下:SELECT FORMAT(12562.6655,2);结果:12,562.67查看文档:Formats the number X to a format like #,###,###.##, rounded to D decimal places, and returns the result as a string. If D is 0, the result has no decimal point or fr…

第一行代码读书笔记

学习安卓很长时间了,但所学的知识不成系统,在开发的时候遇到问题只会Google,而且同样的问题要Google很多次才能记得下来,总结之后发现我并没有理解问题出现的原因,只是盲目的找不同的解决方案,不停的改改改&#xff0c…

python判断是否为数字小数_python如何判断元素是否为小数

python如何判断元素是否为小数发布时间:2020-09-24 15:48:31来源:亿速云阅读:79作者:Leah这篇文章将为大家详细讲解有关python如何判断元素是否为小数,文章内容质量较高,因此小编分享给大家做个参考&#x…

如何用python写文件_我将如何用python写入文件

如何将分数写入文件?import randomscore0question0for i in range(10):num1 random.randint(1,10)num2 random.randint(1,10)ops [, -, *]operation random.choice(ops)Q int(input(str(num1)operationstr(num2)))if operation :answernum1num2if Q answer:prin…