想了解原型和原型链,我觉得首先我们得知道javascript里有一个Object 与 Function,它俩都是构造函数,当然函数也是一个对象。我们打印Object 与 Function看一下,

console.log(Function)

console.log(Object)

那么这个Object 与 Function 之间有何关系与区别呢?首先您只需要记住:

1. 所有普通对象都是 Object 的实例(也就是说Object是所有普通对象的爸爸);

2. 所有普通函数都是 Function 的实例(也就是说Function是所有普通函数的爸爸);

3. Function是 Object 的实例;(Object是所有对象的爸爸)

构造函数与原型对象的区别:

Object是构造函数,而Object.prototype是构造函数的原型对象。构造函数自身的属性和方法无法被共享,而原型对象的属性和方法可以被所有实例对象所共享。

其次,constructor属性是原型对象上的一个属性,可以被所有实例对象所共享。要注意的是,prototype是构造函数的属性,而constructor则是构造函数的prototype属性所指向的那个对象,也就是原型对象的属性。由于constructor属性是一种原型对象和构造函数的关系,所以在修改原型对象的时候,一定要注意constructor的指向问题。

接下来我们说重点,javascript里的__proto__ 和 prototype 属性。

1. 所有的对象都有__proto__ 属性,可通过__proto__属性来访问这个对象的原型,而 __proto__ 指向的是它原型对象的prototype 属性(对象没有prototype属性);

2. 所有的构造函数都有一个prototype 和 __proto__ 属性,而该函数的prototype属性指向的是它原型对象上的constructor属性。

代码实例:

var A = function () {} // 申明一个函数对象A;

var B = new A(); // 为A创建一个实例B;

console.log("A.prototype:", A.prototype);

console.log("B.__proto__:", B.__proto__);

console.log(A.prototype === B.__proto__);

Prototype 的作用:

可以为原型的实例设置公用的属性或方法;

var A = function () {

    this.ary1 = [];

}

var B = new A();

var C = new A();

B.ary1.push(1);

C.ary1.push(2);
console.log(B.ary1)     console.log(C.ary1)   
A.prototype.ary2 = [];

B.ary2.push(1);

C.ary2.push(2);

console.log(B.ary2); 

 

最后总结下什么是原型链:

所有的对象都有一个__proto__属性,我们通过对象的__proto__属性一层层的向上访问,最终会得到值null;那么我们访问的整个路径就是这个对象的原型链。

(感觉个人理解还是不够深刻,这里只是记录一下自己目前对于原型链的理解,多多指教!)

 

javascript原型与原型链个人理解的更多相关文章

  1. 深入理解JavaScript作用域和作用域链

    前言 JavaScript 中有一个被称为作用域(Scope)的特性.虽然对于许多新手开发者来说,作用域的概念并不是很容易理解,本文我会尽我所能用最简单的方式来解释作用域和作用域链,希望大家有所收获! ...

  2. 【JavaScript】深入理解JavaScript之强大的原型和原型链

    由于JavaScript是唯一一个被广泛使用的基于原型继承的语言,所以理解两种继承模式的差异是需要一定时间的,今天我们就来了解一下原型和原型链. AD: hasOwnProperty函数: hasOw ...

  3. 对Javascript 类、原型链、继承的理解

    一.序言   和其他面向对象的语言(如Java)不同,Javascript语言对类的实现和继承的实现没有标准的定义,而是将这些交给了程序员,让程序员更加灵活地(当然刚开始也更加头疼)去定义类,实现继承 ...

  4. <深入理解JavaScript>学习笔记(5)_强大的原型和原型链

    前言 JavaScript 不包含传统的类继承模型,而是使用 prototypal 原型模型. (prototypal :原型.学好英语还是很重要的) 虽然这经常被当作是 JavaScript 的缺点 ...

  5. 深入理解JavaScript系列(5):强大的原型和原型链

    前言 JavaScript 不包含传统的类继承模型,而是使用 prototypal 原型模型. 虽然这经常被当作是 JavaScript 的缺点被提及,其实基于原型的继承模型比传统的类继承还要强大.实 ...

  6. javascript系列--认识并理解构造函数,原型和原型链

    一.前言 介绍构造函数,原型,原型链.比如说经常会被问道:symbol是不是构造函数:constructor属性是否只读:prototype.[[Prototype]]和__proto__的区别:什么 ...

  7. 如何理解JavaScript的原型和原型链

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

  8. 上帝视角一文理解JavaScript原型和原型链

    本文呆鹅原创,原文地址:https://juejin.im/user/307518987058686/posts 前言 本文将从上帝角度讲解JS的世界,在这个过程中,大家就能完全理解JS的原型和原型链 ...

  9. javascript 原型及原型链的初步理解

    最近折腾了好久,终于是把js里面的原型和原型链做了个初步的理解: 在这里,我打个比喻: 我(child),我妈constructor(构造函数)生了我:别人问我老妈跟谁生的我,于是此时我妈会指向我爸爸 ...

随机推荐

  1. fmri格式相关简介————转自网络

    转自莫毕业 目前,脑成像数据主要有DTI.fmri.3D三种模态.这些数据在分析前都要进行格式转换,不同公司的扫描仪存储格式也不尽相同.脑成像处理软件也很多,不同软件使用的格式也不一样,所以数据转换是 ...

  2. Ironic 裸金属管理服务

    目录 文章目录 目录 Ironic 软件架构设计 资源模型设计 全生命周期的状态机设计 Inspection 裸金属上架自检阶段 Provision 裸金属部署阶段 Clean 裸金属回收阶段 快速体 ...

  3. JAVA记事本的图形用户界面应用程序含加密

    JAVA记事本的图形用户界面应用程序 加密 题目简介: 整体分析: 实验代码: import java.awt.EventQueue; import java.awt.event.ActionEven ...

  4. 【转载】WEBRTC基本介绍

    “WebRTC,名称源自网页实时通信(Web Real-Time Communication)的缩写,是一个支持网页浏览器进行实时语音对话或视频对话的技术,是谷歌2010年以6820万美元收购Glob ...

  5. redis的日常操作(1)

    一.简介 [概述] redis是一种nosql数据库,他的数据是保存在内存中,同时redis可以定时把内存数据同步到磁盘,即可以将数据持久化,并且他比memcached支持更多的数据结构(string ...

  6. visual studio 2019 中初始化 vue.js 项目

    vs项目模板,webpack模板的创建方式在vs里创建后,npm install的过程会卡很久,暂时原因不明,感觉应该是文件太多,需要写入太多零碎文件. 试了几种初始化方法,还是用最新cli创建最好, ...

  7. python学习之那些你不在乎却操作非主流的练习题(一)

    1.写代码,有如下列表,按照要求实现每⼀个功能 lis = [2, 3, "k", ["qwe", 20, ["k1", ["tt ...

  8. 【POJ - 3984】迷宫问题(dfs)

    -->迷宫问题 Descriptions: 定义一个二维数组: int maze[5][5] = { 0, 1, 0, 0, 0, 0, 1, 0, 1, 0, 0, 0, 0, 0, 0, 0 ...

  9. 【AMAD】jsonschema -- (又)一个JSON Schema的Python实现

    动机 简介 用法 个人评分 动机 JSON Schema1是一个专业词汇,可以让你注解和验证JSON文档. 使用JSON Schema的好处有: 描述你的数据格式 提供清晰的易读的文档 验证数据: 用 ...

  10. 必须要掌握的linux目录路径知识

    一./etc/sysconfig/network-scripts/ifcfg-en33    配置网络地址及GW等. 下面图片是一些常用的linux命令: nmtui(setup)---------- ...