深入理解JavaScript中的继承:原型链篇
一、何为原型链
原型是一个对象,当我调用一个对象的方法时,如果该方法没有在对象里面,就会从对象的原型去寻找。JavaScript就是通过层层的原型,形成原型链。
二、谁拥有原型
任何对象都可以有原型,当我们创建对象的时候,会自动为对象添加一个属性,这个属性就是原型,我们无法访问到他,但在firefox和chrome中可以通过一个非标准的属性__proto__(双下划线)来访问到原型(或通过Object.getPrototypeOf来访问)。
三、理解原型链
我们先从以下代码入手
var foo = {};
console.log(foo.toString()); // [object Object]
console.log(foo.__proto__); // object { ... } 这里指向Object.prototype
foo里面明明没有toString方法,但我却能调用,这就是原型链的作用。当我调用foo.toString时,由于在里面找不到toString方法,那么我从__proto__属性里面去找,找到后并调用。上面的代码中我们就是从Object.prototype中找到了toString方法。你可能会很困惑,prototype是什么?我们不要被prototype所迷惑,他只是一个存放属性的容器而已,你可以如下这样做来实现继承(但尽量不要这么做)
function Bar() {}
Bar.test = {
say: function () {
console.log('say test');
}
}
var foo = new Bar();
foo.say(); // 报错
// 改变继承的对象
foo.__proto__ = Bar.test;
foo.say() // say test
在上面的代码中我们通过new的形式来创建一个对象,在new的过程中对象会将__proto__指向函数的prototype,由于prototype中是没有say函数的,所以调用会报错,但是之后我们强行改变了继承的对象,将foo的继承对象改为Bar.test,所以我们就能调用say函数了。
我想你已经明白个大概了,prototype事实上并没有什么特殊的,硬要说有什么特殊的话,他只是被JavaScript默认为原型属性的存放点而已,他本质上只是个对象,原型链的重点就在于__proto__,你可以试着把__proto__当作桥梁,当我在对象内部找不到属性时,我就会通过这座桥梁到对面的对象里去寻找属性,直到找到为止或者对象里没有桥梁时才停下来。JavaScript就是通过这样的方式来形成原型链,实现继承的关系。
最后说一下,__proto__只是方便我们查看对象的原型而已,大家不要通过修改__proto__来实现继承的关系,而是要用如构造函数之类的方式来实现继承,这个我会放到以后的文章去说。
(ps:可能有动手能力强的同学会自己去测试,发现__proto__里面也有__proto__,一直循环下去,无穷无尽,但事实上你去获取的时候你会发现Object.__proto__.__proto__.__proto__的值是null,也就是没有原型。)
深入理解JavaScript中的继承:原型链篇的更多相关文章
- 深入理解JavaScript中的继承
1前言 继承是JavaScript中的重要概念,可以说要学好JavaScript,必须搞清楚JavaScript中的继承.我最开始是通过看视频听培训班的老师讲解的JavaScript中的继承,当时看的 ...
- 深入理解Javascript中构造函数和原型对象的区别
在 Javascript中prototype属性的详解 这篇文章中,详细介绍了构造函数的缺点以及原型(prototype),原型链(prototype chain),构造函数(constructor) ...
- 深入理解Javascript中构造函数和原型对象的区别(转存)
Object是构造函数,而Object.prototype是构造函数的原型对象.构造函数自身的属性和方法无法被共享,而原型对象的属性和方法可以被所有实例对象所共享. 首先,我们知道,构造函数是生成对象 ...
- JavaScript中的继承(原型链)
一.原型链 ECMAScript中将原型链作为实现继承的主要方法,基本思想是利用原型让一个引用类型继承另一个引用类型的属性和方法. 实例1: function SupType() { this.pro ...
- 深入理解javascript中实现面向对象编程方法
介绍Javascript中面向对象编程思想之前,需要对以下几个概念有了解: 1. 浅拷贝和深拷贝:程序在运行过程中使用的变量有在栈上的变量和在堆上的变量,在对象或者变量的赋值操作过程中,大多数情况先是 ...
- 理解JavaScript中的原型继承(2)
两年前在我学习JavaScript的时候我就写过两篇关于原型继承的博客: 理解JavaScript中原型继承 JavaScript中的原型继承 这两篇博客讲的都是原型的使用,其中一篇还有我学习时的错误 ...
- JavaScript 中实现继承的方式(列举3种在前一章,我们曾经讲解过创建类的最好方式是用构造函数定义属性,用原型定义方法。)
第一种:对象冒充 function ClassA(sColor) { this.color = sColor; this.sayColor = function () { alert(this.col ...
- 深入理解JavaScript中创建对象模式的演变(原型)
深入理解JavaScript中创建对象模式的演变(原型) 创建对象的模式多种多样,但是各种模式又有怎样的利弊呢?有没有一种最为完美的模式呢?下面我将就以下几个方面来分析创建对象的几种模式: Objec ...
- 深入理解javascript中执行环境(作用域)与作用域链
深入理解javascript中执行环境(作用域)与作用域链 相信很多初学者对与javascript中的执行环境与作用域链不能很好的理解,这里,我会按照自己的理解同大家一起分享. 一般情况下,我们把执行 ...
随机推荐
- java 线程一
java基础学习总结--线程(一) 一.线程的基本概念 线程理解:线程是一个程序里面不同的执行路径 每一个分支都叫做一个线程,main()叫做主分支,也叫主线程. 程只是一个静态的概念,机器上的一个. ...
- 深入理解计算机系统chapter8
进程轮流使用处理器 父进程调用fork来创建一个新的子进程 回收子进程 waitpid/wait 非本地跳转:
- MySQL+Keepalived配置高可用
服务器环境: 主mysql:192.168.1.163 从mysql:192.168.1.126 VIP:192.168.1.50 一.mysql配置主从同步 1.配置主mysql服务器 vim /e ...
- vue-chat项目之重构与体验优化
前言 vue-chat 也就是我的几个月之前写的一个基于vue的实时聊天项目,到目前为止已经快满400star了,注册量也已经超过了1700+,消息量达2000+,由于一直在实习,没有时间对它频繁地更 ...
- Power Sum 竟然用原根来求
Power Sum Time Limit: 20000/10000MS (Java/Others) Memory Limit: 128000/64000KB (Java/Others) SubmitS ...
- 编写通用shell脚本启动java项目,适用于多数服务,只需修改服务名即可
文件名:service-user.sh 文件内容: ##shell脚本的头文件必须有#!/bin/sh ##再次配置java环境变量以防报其他错误## java env#jdk安装目录export J ...
- 斐波那契数列第N项f(N)[矩阵快速幂]
矩阵快速幂 定义矩阵A(m*n),B(p*q),A*B有意义当且仅当n=p.即A的列数等于B的行数. 且C=A*B,C(m*q). 例如: 进入正题,由于现在全国卷高考不考矩阵,也没多大了解.因为遇到 ...
- 用python爬虫爬取去哪儿4500个热门景点,看看国庆不能去哪儿
前言:本文建议有一定Python基础和前端(html,js)基础的盆友阅读. 金秋九月,丹桂飘香,在这秋高气爽,阳光灿烂的收获季节里,我们送走了一个个暑假余额耗尽哭着走向校园的孩籽们,又即将迎来一年一 ...
- MyEclipse的JQuery.min.js报错红叉解决办法
MyEclipse的JQuery.min.js报错红叉解决办法 1.选中报错的jquery文件"jquery-1.2.6.min.js".2.右键选择 MyEclipse--> ...
- java基本的要点
我想告诉大家的不是什么java基本要点,只是对初学者的一点忠告,本人是从八维学校亲身经历过的学生,要想学好并且快速了解java,那你首先必须有英语底子,没有英语底子,几个单词都不会的,我觉得还是放弃学 ...