1 instanceof:

1.1 普通使用下: 判断一个对象是否是某个构造函数的实例:

语法 : 对象 instanceof 函数 是则返回true,不是则返回false.

console.log(obj instanceof Object);

1.2 高级用法:

判断一个函数的原型对象,是否在实例对象的原型链上

1.3 案例如下:

var arr = [];
console.log(arr instanceof Array); //true
console.log(arr instanceof Object); //true

2 原型链

MDN文档是这样解释的:

2.1 .JavaScript 常被描述为一种基于原型的语言 (prototype-based language)——每个对象拥有一个原型对象,对象以其原型为模板、从原型继承方法和属性。

其中:

1 对象 调用.prototype属性,访问到原型对象.可对其操作.

2 原型对象 调用.constructor属性,访问到对象.

3 解释demo如下:

(下面举例以构造函数Person作为文档中的对象来解释).

function Person(){

 }
Person.prototype.sayName = function(){
console.log(1);
} var zs = new Person();
zs.sayName();//

4 下图为关系示意图:

以父亲(构造函数原型对象) 母亲(构造函数) 儿子(实例对象zs)来解释其间的关系.

释义:

释义1 var zs = new Person();

构造函数Person(母亲)),创造了实例对象(儿子)zs.

释义2 Person.prototype.sayName

Person通过 Person.prototype访问到(父亲)"原型对象",并添加了函数sayName.

释义3 zs.sayName();//1

(儿子)zs可以访问到,父母两对象内的所有变量和方法.

释义4 Person.prototype.constructor.prototype.sayName

(父亲)"原型对象"通过.constructor,访问到构造函数Person(母亲).

2.2 . 原型对象也可能拥有原型,并从中继承方法和属性**,一层一层、以此类推**。

这种关系常被称为原型链 (prototype chain),它解释了为何一个对象会拥有定义在其他对象中的属性和方法。

关系如下图所示:

解释:

2.1 原型对象(父亲)本身,也可能作为儿子被创造出来. 即:原型对象(父亲)上面也有它的父亲母亲,去继承他们的属性方法去使用.

2.2 通过这一层层的关系,从**实例对象 ~ null **构成了一个原型链.

3 .原型链使用:

3.1 根据原型链特有的规则,我们通常在对象内添加公共属性;原型对象内添加私有属性.

4 对象查找属性的规则:

先在自己身上找属性,如果有,就直接返回,如果没有,就顺着原型链往上找

javascript总结50:认识instanceof 与 原型链的更多相关文章

  1. JS学习笔记——JavaScript继承的6种方法(原型链、借用构造函数、组合、原型式、寄生式、寄生组合式)

    JavaScript继承的6种方法 1,原型链继承 2,借用构造函数继承 3,组合继承(原型+借用构造) 4,原型式继承 5,寄生式继承 6,寄生组合式继承 1.原型链继承. <script t ...

  2. JavaScript学习总结(四)——this、原型链、javascript面向对象

    一.this 在JavaScript中this表示:谁调用当前函数this就指向谁,不知道调用者时this指向window. JavaScript是由对象组成的,一切皆为对象,万物皆为对象.this是 ...

  3. javascript类继承系列二(原型链)

    原型链是采用最主要的继承方式,原理:每一个类(构造器,js中的function)都有一个原型属性(prototype)指向一个原型对象,原型对象有一个构造器(constructor),它又指回到fun ...

  4. 玩转JavaScript OOP[3]——彻底理解继承和原型链

    概述 上一篇我们介绍了通过构造函数和原型可以实现JavaScript中的“类”,由于构造函数和函数的原型都是对象,所以JavaScript的“类”本质上也是对象.这一篇我们将介绍JavaScript中 ...

  5. JavaScript继承基础讲解,原型链、借用构造函数、混合模式、原型式继承、寄生式继承、寄生组合式继承

    说好的讲解JavaScript继承,可是迟迟到现在讲解.废话不多说,直接进入正题. 既然你想了解继承,证明你对JavaScript面向对象已经有一定的了解,如还有什么不理解的可以参考<面向对象J ...

  6. JavaScript提高篇之面向对象之单利模式工厂模型构造函数原型链模式

    1.单例模式 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...

  7. JavaScript原型链及继承

    在JavaScript中,所有的东西都是对象,但是JavaScript中的面向对象并不是面向类,而是面向原型的,这是与C++.Java等面向对象语言的区别,比较容易混淆,因此把我自己学习的过程记录下来 ...

  8. 理解 JavaScript 对象原型、原型链如何工作、如何向 prototype 属性添加新的方法。

    JavaScript 常被描述为一种基于原型的语言 (prototype-based language)——每个对象拥有一个原型对象,对象以其原型为模板.从原型继承方法和属性.原型对象也可能拥有原型, ...

  9. 一张图搞懂 Javascript 中的原型链、prototype、__proto__的关系 转载加自己的总结

    1. JavaScript内置对象 所谓的内置对象 指的是:JavaScript本身就自己有的对象 可以直接拿来就用.例如Array String 等等.JavaScript一共有12内置对象    ...

随机推荐

  1. JavaScript 数组some()和filter()

      some方法 array1.some(callbackfn[, thisArg]) 对数组array1中的每个元素调用回调函数callbackfn,当回调函数返回true或者遍历完所有数组后,so ...

  2. jQuery中this与$(this)的区别实例

    <p><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "<a hre ...

  3. jquery Autocomplete函数

    <!doctype html> <html lang="en"> <head> <meta charset="utf-8&quo ...

  4. 自己个儿写的循环分配txt中的内容

    <?php header("Content-type:text/html;charset=utf8"); //当前日期 $now = time(); //作为程序是否执行的依 ...

  5. Firefox显示 您的链接不安全 的解决办法

    Firefox浏览器,今天突然打开网页的时候提醒,“您的链接不安全”,于是网页怎么刷新都打不开.后来几经查询终于解决,下面告诉大家该如何解决这种情况. 百度经验:jingyan.baidu.com 工 ...

  6. Rhythmk 一步一步学 JAVA(11)Ibatis 环境配置

    1.项目文件分布. 2.example1.java: package com.rhythmk.example1; import java.io.IOException; import java.io. ...

  7. leetcode503

    public class Solution { public int[] NextGreaterElements(int[] nums) { int n = nums.Length; int[] ne ...

  8. README.md的编写

    1.编辑README文件 大标题(一级标题):在文本下面加等于号,那么上方的文字就变成了大标题,等于号的个数无限制,但一定要大于0 大标题 ==== 中标题(二级标题):在文本下面加下划线,那么上方的 ...

  9. 浅谈JobExecutionContext&JobDataMap

  10. Perl 变量:哈希变量

    Perl 哈希变量哈希是 key/value 对的集合.Perl中哈希变量以百分号 (%) 标记开始.访问哈希元素格式:${key}. 1.创建哈希创建哈希可以通过以下两种方式: 1.为每个 key ...