javascript prototype 、_proto_和constructor之间的关系

javascript没有父类和子类的概念,它们之间的集成是通过一种“原型链”来集成,每个function对象都有prototype属性,可以用来做内存块共享,在各个实例中共享数据。

先总结几条规律

1.任何函数由function关键字定义的都可以用new关键字实例一个对象,都有prototype属性,都有construtor构造函数,构造器属性,他们的proto 链指向function对象。

2.单例对象,如Math,JSON都是以对象形式存在的,无法new,没有prototype属性,没有construtor构造函数,构造器属性。

3.prototype属性指向对象本身,construtor对象包含在其中,指向对象本身。

4.几种函数书写方式的区别

var aa = function(){};//变量aa是指向匿名函数的一个引用
function bb(){};  //bb是定义了一个函数体名称为bb
var cc = new Function("x", "y", "return x + y");//
var sum = cc(17, 34); //Function是一种引用类型,function是它派生出来的,function继承于Function,所以function的_proto_指向Function的prototype

proto 是什么东西呢,javascript中,每个对象都会在内部生成一个proto 属性,当我们访问一个对象属性时,如果这个对象不存在就回去proto 指向的对象里面找,一层一层找下去,这就是javascript原型链的概念。

var Dog = function(){};
Dog.prototype.belongto = ‘animal‘;
var xiaobai = new Dog();
console.log(xiaobai.belongto);

var single = {} ;

这里我们定义了一个对象Dog,并实例化了一次,当xiaobai反问belongto的属性时,发现找不到这个属性,于是就到xiaobai.proto 里面找,这是xiaobai._proto = Dog.prototype.所以输出animal。single属于单例对象,不能new没有prototype和construtor对象

下面贴一张社区关于javascript原型链的图

再说下javascript类的继承,其中有一种方式就是构造函数的原型链继承

var Animal = function(){};
Animal.prototype.belongto = "animal";

var Dog = function(name,color){
   this.name = name ;
   this.color = color ;
};

var xiaobai = new Dog("xiaobai","white");
console.log(xiaobai.belongto);

我怎么让Dog来继承Animal呢,然后控制台能输出animal,最简单的方法

var Dog = function(name,color){
   Aniamal.call(this);
   this.name = name ;
   this.color = color ;
};

再者,原型继承

function extend(Child,Parent){
   var Fn = function(){}; //空函数不占内存
   Fn.prototype = new Parent();
   Child.prototype = new Fn();
   Child.prototype.constructor = Child;
}

extend(Dog,Animal);
var dog = new Dog("xiaobai","white");
console.log(dog.belongto);

为什么extend中child.prototype.construcor = child,因为dog = new Dog()的构造函数是Animal,不能更改原始对象。

				
时间: 2024-08-28 17:38:43

javascript prototype 、_proto_和constructor之间的关系的相关文章

js中prototype,__proto__,constructor之间的关系

首先,我们需要了解三点: 1. 只要创建一个任意新函数,就会根据一个prototype属性,该属性指向函数的原型对象: 2. 每一个原型对象都会自动获得一个constructor属性,该属性只想prototype所在函数的指针: 3. 当调用构造函数创建实例时,该实例内部将包含一个指向构造函数原型对象的指针,在大部分浏览器中用__proto__标识: 从上面这三点我们可以了解到: 正常情况下:prototype属性 -> 原型对象 原型对象的constructor属性 -> 构造函数(即拥有p

javascript中Object与Function之间的关系

首先看几个例子: Function instanceof Object //true Object instanceof Function // true 说明Object 是被Function 构造出来的 Function instanceof Function //true 说明自己被自己构造 Object.getPrototypeOf(Function) === Function.prototype // true Object.getPrototypeOf(Object.prototyp

浅谈prototype与__proto__、constructor三者之间的关系

1.关于prototype? a.每个函数中都有一个prototype属性,这个属性叫做原型. b.prototype指向的这个对象就叫原型对象. c.prototype表示了一个类的属性的集合. 2.原型对象中包含有constructor和__proto__. 3.当通过new将该函数实例化后,其内部方法也可用实例对象调用. 如:var ABC=new wxy(); ABC.case(); 当未被实例化时也可直接声明其内部方法调用. 如:wxy.case(); 4.我们可以通过prototyp

一张图理解prototype、proto和constructor的三角关系

× 目录 [1]图示 [2]概念 [3]说明[4]总结 前面的话 javascript里的关系又多又乱.作用域链是一种单向的链式关系,还算简单清晰:this机制的调用关系,稍微有些复杂:而关于原型,则是prototype.proto和constructor的三角关系.本文先用一张图开宗明义,然后详细解释原型的三角关系 图示 概念 上图中的复杂关系,实际上来源就两行代码 function Foo(){}; var f1 = new Foo; [构造函数] 用来初始化新创建的对象的函数是构造函数.在

理解prototype、proto和constructor的三角关系

javascript里的关系又多又乱.作用域链是一种单向的链式关系,还算简单清晰:this机制的调用关系,稍微有些复杂:而关于原型,则是prototype.proto和constructor的三角关系.本文先用一张图开宗明义,然后详细解释原型的三角关系 概念 上图中的复杂关系,实际上来源就两行代码 function Foo(){}; var f1 = new Foo; [构造函数] 用来初始化新创建的对象的函数是构造函数.在例子中,Foo()函数是构造函数 [实例对象] 通过构造函数的new操作

JavaScript和Java之间的关系

今天来简单而又详细地说说JavaScript和Java的关系. 开门见山总结性一句话,它们之间的关系 = 雷锋和雷峰塔之间的关系,换句话说:它们之间没什么关系. 但往往有不少初学者甚至中级者认为它们之间有密切的关系,这很让人无语. 个人认为如果不分辨清楚,Java学得越好的初学者,对于JavaScript就会学得越糟.因为在一张白纸上好画图,在一张花纸上就很难再画图了. 比较 JavaScript Java 诞生时间 1995年 1995年 曾用名 Mocha, LiveScript Oak 母

HTML,CSS,JavaScript,json,xml之间的关系

1.浏览器工作原理: https://blog.csdn.net/Luncles/article/details/80320082 2.HTML,XML,JSON之间的关系: https://blog.csdn.net/qq_36346262/article/details/79335397 3.CSS,HTML,JavaScript并列: HTML+CSS:静态网页 Javascript:动态,交互的一些功能 4.jQuery是JavaScript的一个函数库,可以会HTML进行操作 5.用好

JavaScript基础Literal 与 Constructor(008)

JavaScript支持以字面声名法(Literal)的方式来声名对象和数组,相对于构造函数(constructor)的方式,Literal的声 名方式更简洁,更易读,也更少导致Bug.事实上,JSON就是用Literal的方式定义的JavaScript数据格式. 1. 用Literal的方式创建对象JavaScript里的对象大概就好像是一个装着一堆“键-值对”的哈希表.下面我们给出以Literal方式声名对象的语法: 用花括号把对象的内部包起来(即{}): 对象中的各个键值对之间要用逗号分开

JavaScript prototype 使用介绍

JavaScript prototype 使用介绍 用过JavaScript的同学们肯定都对prototype如雷贯耳,但是这究竟是个什么东西却让初学者莫衷一是,只知道函数都会有一个prototype属性,可以为其添加函数供实例访问,其它的就不清楚了,最近看了一些 JavaScript高级程序设计,终于揭开了其神秘面纱 用过JavaScript的同学们肯定都对prototype如雷贯耳,但是这究竟是个什么东西却让初学者莫衷一是,只知道函数都会有一个prototype属性,可以为其添加函数供实例访