理解JavaScript原型

什么是原型?

原型是一个对象,其他对象可以通过它实现属性继承。

任何一个对象都可以成为原型么?

哪些对象有原型

所有的对象在默认的情况下都有一个原型,因为原型本身也是对象,所以每个原型自身又有一个原型(只有一种例外,默认的对象原型在原型链的顶端。)

当我们已经创建了一个实例对象 ,我们想要这个实例对象继承一个已经存在的对象的功能比如说Array,就可以使用原型

函数A的原型属性(prototype property )是一个对象,当这个函数被用作构造函数来创建实例时,该函数的原型属性将被作为原型赋值给所有对象实例(注:即所有实例的原型引用的是函数的原型属性)

有一个原型属性,这和函数的原型是不一样的
b.prototype //[object Object]   函数b的原型属性

b.__proto__ 或者b.construtor.prototype 函数的原型

//创建一个函数b
var b = function(){ var one; }
//使用b创建一个对象实例c
var c = new b(); 1 b的构造函数
b.constructor; // function Function() { [native code]}
2 实例c的构造函数
c.constructor; // 即 b function(){ var one; } b.constructor==Function.constructor;
c.constructor==b; 3 b的原型
b.constructor.prototype // function (){}
b.__proto__ //function (){} 4 函数b的原型属性
b.prototype //[object Object] 5 c的对象的原型
c.constructor.prototype //[object Object]
c.__proto__ //[object Object] //为函数b的原型属性添加一个属性max
b.prototype.max = 3
//实例c也有了一个属性max
c.max //3
上面的例子中,对象实例c的原型和函数的b的原型属性是一样的,如果改变b的原型属性,则对象实例c
的原型也会改变

  

2  js原型链原理看图说明 太简洁了,最后一个图看不懂呀

当你去定义一个prototype的时候,相当于把该实例的__proto__指向一个结构体,那么这个被指向结构体就称为该实例的原型。

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

var BaseCalculator = function() {
this.decimalDigits = 2;
}; BaseCalculator.prototype = {
add: function(x, y) {
return x + y;
},
subtract: function(x, y) {
return x - y;
}
}; 创建完上述代码以后,我们来开始: var Calculator = function () { //为每个实例都声明一个税收数字 this.tax = 5;
}; Calculator.prototype = new BaseCalculator();

  我们可以看到Calculator的原型是指向到BaseCalculator的一个实例上,目的是让Calculator集成它的add(x,y)和subtract(x,y)这2个function,还有一点要说的是,由于它的原型是BaseCalculator的一个实例,所以不管你创建多少个Calculator对象实例,他们的原型指向的都是同一个实例。

属性在查找的时候是先查找自身的属性,如果没有再查找原型,再没有,再往上走,一直插到Object的原型上

hasOwnProperty是Object.prototype的一个方法,它可是个好东西,他能判断一个对象是否包含自定义属性而不是原型链上的属性,因为hasOwnProperty 是 JavaScript 中唯一一个处理属性但是不查找原型链的函数。

JavaScript原型学习笔记的更多相关文章

  1. JavaScript正则表达式学习笔记(二) - 打怪升级

    本文接上篇,基础部分相对薄弱的同学请移步<JavaScript正则表达式学习笔记(一) - 理论基础>.上文介绍了8种JavaScript正则表达式的属性,本文还会追加介绍几种JavaSc ...

  2. javascript正则表达式 - 学习笔记

    JavaScript 正则表达式 学习笔记 标签(空格分隔): 基础 JavaScript 正则表达式是用于匹配字符串中字符组合的模式.在javascript中,正则表达式也是对象.这些模式被用于Re ...

  3. JavaScript简易学习笔记

    学习地址:http://www.w3school.com.cn/js/index.asp 文字版: https://github.com/songzhenhua/github/blob/master/ ...

  4. javaScript 对象学习笔记

    javaScript 对象学习笔记 关于对象,这对我们软件工程到学生来说是不陌生的. 因为这个内容是在过年学到,事儿多,断断续续,总感觉有一丝不顺畅,但总结还是要写一下的 JavaScript 对象 ...

  5. 【MarkMark学习笔记学习笔记】javascript/js 学习笔记

    1.0, 概述.JavaScript是ECMAScript的实现之一 2.0,在HTML中使用JavaScript. 2.1 3.0,基本概念 3.1,ECMAScript中的一切(变量,函数名,操作 ...

  6. Javascript MVC 学习笔记(一) 模型和数据

    写在前面 近期在看<MVC的Javascript富应用开发>一书.本来是抱着一口气读完的想法去看的.结果才看了一点就傻眼了:太多不懂的地方了. 仅仅好看一点查一点,一点一点往下看吧,进度虽 ...

  7. JavaScript闭包学习笔记

    此文都是大牛们关于闭包的观点,在此只是总结. 闭包应用的两种情况即可——函数作为返回值,函数作为参数传递. 1 深入理解javascript原型和闭包 判断一个变量是不是对象非常简单.值类型的类型判断 ...

  8. Javascript作用域学习笔记(三)

    看完<你不知道的javascript>上,对作用域的新的理解(2018-9-25更) 一.学习笔记:   1.javascript中的作用域和作用域链 +  每个函数在被调用时都会创建一个 ...

  9. javascript类和原型学习笔记

    js中类的所有实例对象都从同一个原型对象上继承属性.我们可以自己写一个对象创建的工厂方法来来"模拟"这种继承行为: //inherit()返回一个继承自原型对象p的属性的性对象 / ...

随机推荐

  1. 运用C#生成docx格式的报表

    这几天在北京做一个大桥的监测系统的项目,涉及到一个功能,那就是采集数据,处理后,希望能自动生成一个报表,只需要在一个模板的基础上加几个数就可以了,但因为希望生成的是.docx格式的word2007/2 ...

  2. php中的访问修饰符 private、protected、public的作用范围

    1. private 只能在类内部使用 2. protected 可以在类内部和继承类里使用.类外部不能使用[即实例化后的对象无法调用] 3. public 全部范围适用. 4.子类复写父类中的方法时 ...

  3. IIS 7中 ISAPI 错误解决

    在本地IIS种发布了一个测试网站,浏览的时候提示 404 错误,无法显示页面,具体错误如下: 解决办法如下: 选择IIS根目录,在右边的功能视图中选择 “ISAPI 和 CGI限制”,双击打开, 把相 ...

  4. 使用nodewebx进行前后端开发环境分离

    下载nodewebx(windows环境) npm install nodewebx npm install inherits 为什么要下载inherits,因为nodewebx依赖它... 构建目录 ...

  5. MySQL数据库一个字段对应多个值得模糊查询

    当一个字段想模糊查询出多个字段的时候,正常情况下一般会这么作 select * from a where name like 'a%' or name like 'b%' ....or ...; 但是 ...

  6. 配置org.springframework.scheduling.quartz.CronTriggerBean (转载)

    在项目中又用到了定时器,对于定时器的应用总是模模糊糊的,今天结合网上找到的资料与自己在项目中写的简单地在此写一下,以备需要时查阅. 一个Quartz的CronTrigger表达式分为七项子表达式,其中 ...

  7. Scrum Meeting 7-20151209

    任务安排 姓名 今日任务 明日任务 困难 董元财 服务器购买记录接口 请假(编译攻坚) 无 胡亚坤 发布记录和购买记录 请假(编译攻坚) 无 刘猛 完成Scrum Meeting 请假(编译攻坚) 无 ...

  8. window打开服务的dos命令

    window打开服务的dos命令   “开始”---> “运行”输入以下命令,或者Win + R,输入以下命令 对我比较有用的几个: 10. notepad--------打开记事本  31. ...

  9. 使用easyui时 进入一个新页面 前要经过一个页面混乱的时候 才到正常的页面去

    var width = $(window).width(); var height = $(window).height(); var html = "<div id='loading ...

  10. AlwaysOn数据同步问题探究

    随着AlwaysOn技术的流行,关于AlwayOn的问题也越来越多,某企业搭建有三副本的AlwaysOn一套,现想修改主节点上某张表的某个数据,看看会出现什么后果,如果结果正常,就同步到其他节点上:如 ...