javascript原型和原型链

     2022-03-22     772

关键词:

一、JavaScript 中,万物皆对象!但对象也是有区别的。分为普通对象和函数对象。
凡是通过 new Function() 创建的对象都是函数对象,其他的都是普通对象。
Object 、Function 是 JavaScript 自带的函数对象。

var o1 = {}; 
var o2 =new Object();
var o3 = new f1();

function f1(){}; 
var f2 = function(){};
var f3 = new Function(‘str‘,‘console.log(str)‘);

console.log(typeof Object); //function 
console.log(typeof Function); //function  

console.log(typeof f1); //function 
console.log(typeof f2); //function 
console.log(typeof f3); //function   

console.log(typeof o1); //object 
console.log(typeof o2); //object 
console.log(typeof o3); //object

二、构造函数

function Person(name, age, job) {
 this.name = name;
 this.age = age;
 this.job = job;
 this.sayName = function() { alert(this.name) } 
}
var person1 = new Person(‘Zaxlct‘, 28, ‘Software Engineer‘);
var person2 = new Person(‘Mick‘, 23, ‘Doctor‘);

person1 和 person2 都是 Person 的实例
这两个实例都有一个 constructor (构造函数)属性,该属性(是一个指针)指向 Person。即:

console.log(person1.constructor == Person); //true
console.log(person2.constructor == Person); //true

我们要记住两个概念(构造函数,实例):
person1 和 person2 都是 构造函数 Person 的实例
一个公式:
实例的构造函数属性(constructor)指向构造函数。
person1.constructor == Person

三、原型对象
function Person(){}
每个函数对象都有一个prototype 属性,即Person.prototype,这个属性指向函数的原型对象(一个普通对象)。
公式一】:每个对象都有 proto 属性,但只有函数对象才有 prototype 属性
在大多数情况下,proto可以理解为"构造器的原型",即:proto === constructor.prototype

原型对象,顾名思义,它就是一个普通对象(废话 = =!)。从现在开始你要牢牢记住原型对象就是 Person.prototype ,它有一个默认的属性:constructor(构造函数),这个属性(是一个指针)指向 prototype 属性所在的函数(Person)
即:Person.prototype.constructor == Person

结论】:原型对象(Person.prototype)是 构造函数(Person)的一个实例。

javascript扩展原型链浅析

...简单的概念介绍和解析,本文将浅析一些原型链的扩展。javaScript原型和原型链http://lewyon.xyz/prototype.html扩展原型链使用new操作符利用原型是对象的特性,实例化对象的时候,继承多个构造函数的属性和方法兼容性:支持目前 查看详情

javascript探秘:强大的原型和原型链

...是上例中的for(variinfoo){if(foo.hasOwnProperty(i)){console.log(i);}}JavaScript不包括传统的类继承模型,而是使用prototypal原型模型。尽管这常常被当作是JavaScript的缺点被提及,事实上基于原型的继承模型比传统的类继承还要强大。实现传统... 查看详情

介绍下javascript原型和原型链的特点?

JavaScript原型:每个对象都会在其内部初始化一个属性,就是prototype(原型)。 原型链:当我们访问一个对象的属性时,如果这个对象内部不存在这个属性,那么他就会去prototype里找这个属性,这个prototype又会有自己的prototype,... 查看详情

原型和原型链—javascript面向对象高级

原型 1.原型有什么用:js是用原型来实现继承 2.原型是:每一个对象都有其原型对象__proto__,这个原型对象指向构造它的构造函数的原型属性prototype. ##一、函数和对象的关系## 1.函数是对象的一种,instanceof可以判断... 查看详情

5.javascript原型链和继承详解(代码片段)

JavaScript原型链和继承详解上一篇JavaScript作用域和闭包详细总结下一篇JavaScript浅层克隆和深层克隆文章目录JavaScript原型链和继承详解一、原型二、原型链原型链图解了解this与call/apply方法三、继承一、原型1.定义:原型是funct... 查看详情

javascript原型链之原型对象实例和构造函数三者之间的关系

【转】Javascript原型链之原型对象、实例和构造函数三者之间的关系  查看详情

javascript----原型,原型链(什么是原型)

...把这部分抽取出来讲。再讲这个概念时我们先大致了解下JavaScript中的“对象”。什么是对象?JavaScript权威指南中给的解释是:对象是一种复合数据类型,它们将多个数据值集中在一个单元中,而且允许使用名字来存取这些值。或... 查看详情

javascript原型和原型链(代码片段)

...ctor,prototype,proto。constructor在之前判断数据类型的文章:javaScript常见数据类型检查校验有提到过关于构造函数的属性constructorconstructor的是返回创建实例对象的构造函数的引用,这个属性的值是对函数本身的引用,而不是一个包... 查看详情

javascript原型和原型链

一、JavaScript中,万物皆对象!但对象也是有区别的。分为普通对象和函数对象。凡是通过newFunction()创建的对象都是函数对象,其他的都是普通对象。Object、Function是JavaScript自带的函数对象。varo1={};varo2=newObject();varo3=newf1();function... 查看详情

javascript原型和原型链

一、对象与函数的关系1.对象是函数创建,函数也是一种对象。2.对象的创建方式2.1.Object构造函数创建对象newObject();2.2.字面量创建对象varx=new();其本质就是newObject方式创建。2.3.通过工厂模式创建,在方法中使用newObject();可以... 查看详情

如何理解javascript的原型和原型链

在现在的业务开发中,应该很少人在写原生JavaScript了,大家都一股脑地扑在各个框架上。本来,这些框架对于业务和开发者来说是一种福音,减少了各种各样的开发痛点,但是带来的负面问题就是对于开发者来说,越来越依赖... 查看详情

对javascript的原型,原型链和继承的个人理解

继承是OO语言中一个最为人津津乐道的概念,也是初接触Javascript的初学者难理解的概念=。=继承主要分为两种:一种是接口继承,另一种是实现继承。而在ECMAScript中只支持实现继承,所以我们今天来讨论讨论实现继承。实现继承... 查看详情

javascript原型链理解

  javascript原型和原型链的引入,最初的目的是属性和方法的共享。没有原型,我们使用同一个构造函数新建的一系列对象,就都拥有一组完全相互独立的属性和方法,但是方法和一些属性我们不需要所有对象都各自有一个,... 查看详情

javascript里的原型链

...prototype)中,prototype的值是一个Object类型数据(对象)。JavaScript的数据对象有哪些 查看详情

前端面试-原型和原型链

classjavaScript原型链javaScript类 查看详情

javascript之原型和原型链

  众所周知CSS技术我们虽然很熟悉,在使用的过程却很容易被困住,这让我们在新问题出现的时候变得很不利。随着web继续不断地发展,对于新技术新解决方案的要求也会不断增长。因此,作为网页设计师和前端开发人员... 查看详情

十分钟读懂javascript原型和原型链

...丁文的词proto,意谓“最初的”,意义是形式或模型。在JavaScript中,原型的探索也有很多有趣的地方,接下来跟随我的脚步去看看吧。原型对象释义每一个构造函数都有一个与之相关联的对象,该对象称之为原型对象。每个实例... 查看详情

javascript之粗浅原型和原型链(代码片段)

目录1、示例代码2、注解1、示例代码functionStudent(params) this.params=params;letstudent=newStudent('159357');console.log(student.__proto__===Student.prototype);//trueconsole.log(student.co 查看详情