js原型和原型链的简单理解

构造函数创建对象:

function Person()
{

}

var person = new Person();
person.name = ‘Tian‘;
console.log(person.name);    //Tian

Person 就是一个构造函数,使用 new 创建了一个实例对象 person

prototype

  每个函数都有一个 prototype 属性

  每一个 javaScript 对象(null除外)在创建的时候就会与之关联另一个对象,这个对象就是我们所说的原型,每一个对象都会从原型“继承”属性。

function Person()
{

}

//protoType是函数才会有的属性
Person.prototype.name = ‘Tian‘;
var person1 = new Person();
var person2 = new Person();
console.log(person1.name);    //Tian
console.log(person2.name);    //Tian

proto

  每一个 javaScript 对象(null除外)都具有的一个属性叫 proto ,这个属性会指向该对象的原型

function Person()
{

}

var person = new Person();
console.log(person.__proto__ === Person.prototype);    //true

 constructor

  每一个原型都有一个 constructor 属性指向关联的构造函数,实例原型指向构造函数

function Person()
{

}

console.log(Person === Person.prototype.constructor);  //true

function Person()
{

}

var person = new Person();
console.log(person.__proto__ === Person.prototype); //true
console.log(Person.prototype.constructor === Person); //true

cosnole.log(Object.getPrototypeOf(person) === Person.prototype); //true

实例与原型

function Person()
{

}

Person.prototype.name = ‘Tian‘;

var person = new Person();

person.name = ‘Anni‘;
console.log(person.name); //Anni

delete person.name;
console.log(person.name); //Tian

  在这个例子中,我们给实例对象 person 添加了 name 属性,当我们打印 person.name 的时候,结果自然为 Anni。

  但是当我们删除了 person 的 name 属性时,读取 person.name,从 person 对象中找不到 name 属性就会从 person 的原型也就是 person.proto ,也就是 Person.prototype中查找,幸运的是我们找到了 name 属性,结果为 Tian。

原型与原型

var obj = new Object();

obj.name = ‘Tian‘;
console.log(obj.name);   //Tian

 原型链

  

javaScript 默认并不会复制对象的属性,相反,JavaScript只是在俩个对象之间创建一个关联,这样一个对象就可以通过委托访问另一个对象的属性和函数,所以与其叫继承,委托的说法更准确些。

原文地址:https://www.cnblogs.com/tg666/p/12059205.html

时间: 2024-11-06 09:41:08

js原型和原型链的简单理解的相关文章

Js 职责链模式 简单理解

js 职责链模式 的简单理解.大叔的代码太高深了,不好理解. function Handler(s) { this.successor = s || null; this.handle = function () { if (this.successor) { this.successor.handle(); } } } var app = new Handler({ handle: function () { console.log('app handle'); } }); var dialo

JavaScript中作用域和作用域链的简单理解(变量提升)

通过阅读<JS高级程序设计>这本书,对js中的作用域和作用域链知识有了初步的了解和认识,准备成笔记供大家参考,笔记中字数比较多,但个人认为叙述的挺详细的,所以希望读者耐心看.再者,本人了解的比较基础,不足的地方希望大家一起交流,共同学习. 1.执行环境(execution context) 执行环境定义了变量和函数有权访问的其他数据,决定了他们各自的行为.每个执行环境都有与之对应的变量对象(variable object),保存着该环境中定义的所有变量和函数.我们无法通过代码来访问变量对象,但

js 关于全局变量和局部变量的简单理解

1.简单来说在  函数里边定义的变量是局部变量,在函数外边访问不到: 全局变量是在函数外边的,在函数内外都可以被访问: var a = 10; function test() { var b = 100; console.log(a);//打印结果是10 a=100; } test(); console.log(a); //打印结果为100 console.log(b);//报错 b is not defind 说明: 因为a 是全局变量所以在函数内部可以被访问且被赋值:第一次打印结果为10:

js原型链的深度理解!

一. 普通对象与函数对象 JavaScript 中,万物皆对象!但对象也是有区别的.分为普通对象和函数对象,Object .Function 是 JS 自带的函数对象.下面举例说明 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(type

js中原型和原型链理解

js中属性的继承以及查找都会用到原型链的知识,对于深入学习js的人来说是一个难点也是一个重点,下面梳理下对于原型以及原型链的理解. 首先,我们要知道什么是原型以及原型链?他们有什么样的作用? 可以理解为JS对象在创建时都会与之关联另一个对象,这就是我们所说的原型,每一个对象都会从原型"继承"属性.下图表示了构造函数与实例原型的关系,其中Object.prototype表示实例原型. 那么实例与实例原型又是怎么联系的呢?接下来又要说到另一个属性__proto__,每一个JS对象都有一个属

JS原型、原型链深入理解

原型是JavaScript中一个比较难理解的概念,原型相关的属性也比较多,对象有”prototype”属性,函数对象有”prototype”属性,原型对象有”constructor”属性. 一.初识原型在JavaScript中,原型也是一个对象,通过原型可以实现对象的属性继承,JavaScript的对象中都包含了一个”[[Prototype]]”内部属性,这个属性所对应的就是该对象的原型.“[[Prototype]]”作为对象的内部属性,是不能被直接访问的.所以为了方便查看一个对象的原型,Fir

深入理解JS继承和原型链

对于那些熟悉基于类的面向对象语言(Java 或者 C++)的开发者来说,JavaScript 的语法是比较怪异的,这是由于 JavaScript 是一门动态语言,而且它没有类的概念( ES6 新增了class 关键字,但只是语法糖,JavaScript 仍旧是基于原型). 涉及到继承这一块,Javascript 只有一种结构,那就是:对象.在 javaScript 中,每个对象都有一个指向它的原型(prototype)对象的内部链接.这个原型对象又有自己的原型,直到某个对象的原型为null 为止

js原型和原型链理解 constructor 构造函数

一.对象:普通对象   函数对象 二.构造函数特点:1.需要new实例化,内部使用this对象指向即将要生成的实例对象  2.首字母大写,用于区分普通函数 function Person(name){ this.name=name } var person1=new Person('xiaohong') var person2=new Person('lili') person1.constructor=Person   constructor指向构造函数,Person的内置属性 Person.

JS原型与原型链终极讲解

function Person () { this.name = 'John'; } var person = new Person(); Person.prototype.say = function() { console.log('Hello,' + this.name); }; person.say();//Hello,John 上述代码非常简单,Person原型对象定义了公共的say方法,虽然此举在构造实例之后出现,但因为原型方法在调用之前已经声明,因此之后的每个实例将都拥有该方法.从