Array.prototype


先记住一句话——每一个函数,都有一个prototype属性——每一个函数,无论是你自定义的,还是系统内置的

var fn = function() {}
console.log( fn.prototype );

这里打印出来的fn.prototype是一个对象,只有一个constructor属性,指向该函数自身,即

fn.prototype.constructor === fn

  

以上是自定义的函数,数组构造函数Array也是一个函数,只不过是浏览器内置的函数,它也得符合以上那句话

console.log( typeof Array );   // 'function'
console.log( Array.prototype );

这里打印出来的Array.prototype也是一个对象,也有一个constructor属性,指向该函数自身

[].__proto__


然后,再记住一句话——所有通过函数new出来的东西,这个东西都有一个__proto__指向这个函数的prototype,这里我们给他们分别取一个中文名字

  • prototype (显示)原型
  • __proto__ 隐式原型
var arr = [];  // 等价于 var arr = new Array()
arr.__proto__ === Array.prototype; // true

然后,再记住一句话——当你想要使用一个对象(或者一个数组)的某个功能时:如果该对象本身具有这个功能,则直接使用;如果该对象本身没有这个功能,则去__proto__中找

var obj = {
fn1: function () {
console.log('fn1');
}
};
obj.fn1(); // 'fn1'
obj.toString(); // '[object Object]' (在 obj.__proto__ 中找到)

数组也一样

var arr = [];
arr.push(1); // 在 arr.__proto__ 中找到了 push 方法

这就是为何数组会有concatpush等方法,顺藤摸瓜最终摸到了Array.prototype中来了

因此,下列代码是成立的

[].concat === Array.prototype.concat;
[].push === Array.prototype.push;
[].map === Array.prototype.map;

__proto__是可修改的


__proto__就是一个基本的js对象,根据js无底线的语法规则,它是完全可以被修改或者重写的

修改__proto__的例子。修改了之后,arr不仅有内置的concatpush等功能,还多了一个addClass功能。

var arr = [1,2,3];
arr.__proto__.addClass = function () {
console.log(123);
}
arr.push(4);
arr.addClass(); // 123

完全重写 __proto__ 的例子,上一节讲过。还是注意,重写__proto__之后,arr可就失去了concatpush等亲人了,只有一个addClass功能了。

var arr = [1,2,3];
arr.__proto__ = {
addClass: function () {
console.log(123);
}
};
arr.addClass(); // 123

  

javascript中的原型和原型链(五)的更多相关文章

  1. Javascript中的对象和原型(3)

    在Javascript中的对象和原型(二)中我们提到,用构造函数创建的对象里面,每个对象之间都是独立的,这样就会降低系统资源的利用率,解决这样问题,我们就要用到下面提到的原型对象. 一 原型对象 原型 ...

  2. Javascript中的对象和原型(三)(转载)

    在Javascript中的对象和原型(二)中我们提到,用构造函数创建的对象里面,每个对象之间都是独立的,这样就会降低系统资源的利用率,解决这样问题,我们就要用到下面提到的原型对象. 一 原型对象 原型 ...

  3. Javascript中的对象和原型(一)(转载)

    面向对象的语言(如Java)中有类的概念,而通过类可以创建任意多个具有相同属性和方法的对象.但是,JavaScript 没有类的概念,因此它的对象也与基于类的语言中的对象有所不同. 要了解面向对象,首 ...

  4. javascript中的对象,原型,原型链和面向对象

    一.javascript中的属性.方法 1.首先,关于javascript中的函数/“方法”,说明两点: 1)如果访问的对象属性是一个函数,有些开发者容易认为该函数属于这个对象,因此把“属性访问”叫做 ...

  5. JavaScript中的继承(原型链)

    一.原型链 ECMAScript中将原型链作为实现继承的主要方法,基本思想是利用原型让一个引用类型继承另一个引用类型的属性和方法. 实例1: function SupType() { this.pro ...

  6. 深入理解JavaScript中的继承:原型链篇

    一.何为原型链 原型是一个对象,当我调用一个对象的方法时,如果该方法没有在对象里面,就会从对象的原型去寻找.JavaScript就是通过层层的原型,形成原型链. 二.谁拥有原型 任何对象都可以有原型, ...

  7. JavaScript中的继承与原型链

    先看一个例子 function User(){} var u1 = new User(); console.log(u1.prototype);// undefined 使用对象实例无法访问到prot ...

  8. javascript中的构造函数和原型及原型链

    纯属个人理解,有错误的地方希望大牛指出,以免误人子弟 1.构造函数: 构造函数的作用 : 初始化由new创建出来的对象    new 的作用: 创建对象(空对象) new 后面跟的是函数调用,使用ne ...

  9. JavaScript中的对象与原型—你不知道的JavaScript上卷读书笔记(四)

    一.对象 对象可以通过两种形式定义:声明(文字)形式和构造形式.即: var myObj = { key: value // ... }; 或: var myObj = new Object(); m ...

  10. JavaScript——中的prototype(原型)

    JS中的prototype是JS中比较难理解的一个部分 本文基于下面几个知识点: 1 原型法设计模式 在.Net中可以使用clone()来实现原型法 原型法的主要思想是,现在有1个类A,我想要创建一个 ...

随机推荐

  1. [转帖]规模化敏捷-简要对比SAFe、LeSS和DAD模式

    规模化敏捷-简要对比SAFe.LeSS和DAD模式 http://blog.sina.com.cn//s/blog_15e1409550102x5yx.html   分类: 敏捷开发 目前有三种将Sc ...

  2. Spark中分布式使用HanLP(1.7.0)分词示例

    HanLP分词,如README中所说,如果没有特殊需求,可以通过maven配置,如果要添加自定义词典,需要下载“依赖jar包和用户字典". 分享某大神的示例经验: 是直接"java ...

  3. Nginx linux下的安装

    1.先把从官网 nginx.io下载 的安装包通过ftp传到服务器上,然后进行解压. 我的安装环境以及nginx版本 :Ubuntu16 ,nginx-1.11.3.tar.gz(经过这个尝试这个版本 ...

  4. Hadoop三种架构介绍及搭建

    apache  hadoop三种架构介绍(standAlone,伪分布,分布式环境介绍以及安装) hadoop 文档 http://hadoop.apache.org/docs/ 1.StandAlo ...

  5. MYSQL 优化--inner buffer 与关联查询变等值查询

    转自:https://www.2cto.com/database/201312/262376.html 在数据库的应用中,我们经常需要对多表进行连表操作来获得关系型的数据,因此,应该更加的掌握好Mid ...

  6. Django基础之jQuery操作

    Django基础之jQuery操作 jquery之cookie操作 定义:让网站服务器把少量数据储存到客户端的硬盘或内存,从客户端的硬盘读取数据的一种技术: 下载与引入:jquery.cookie.j ...

  7. GitHub从小白到熟悉<五>

    GitHub    主页 

  8. 多进程-Pool进程池

    from multiprocessing import Pool import os,time def Foo(i): time.sleep(2) print("in process&quo ...

  9. tasks.json 配置 解决vscode控制台乱码问题

    { "version": "2.0.0", "command": "dotnet", "tasks" ...

  10. Js中toFixed()方法保留小数不精准的问题

    toFixed() 方法可把 Number 四舍五入为指定小数位数的数字. 问题:部分特殊数值使用toFixed() 方法会出现转换不正确的情况,举个例子: (3329.225).toFixed(2) ...