设为首页 加入收藏

TOP

JavaScript 原型与继承机制详解(二)
2017-07-13 10:22:55 】 浏览:327
Tags:JavaScript 原型 继承 机制 详解
右查找(RHS)。相反,若是进行 [[setter]] 操作,也就是赋值操作,也可以称作左查找(LHS),则不会遍历原型链,这条原则保证了我们在对对象进行操作的时候不会影响到原型链:


   在遍历原型链中,如果访问带有 this 引用的方法,可能会发生令你意想不到的结果:


  在上面的内容中,我们讨论过,对象的原型相当于父类,我们可以继承它所拥有的属性和方法,所以在我们访问 foo() 函数的时候时候,实际上调用该方法的对象是 obj2 而不是 obj1。关于更详细的内容,需要了解 this 和上下文绑定,这不在本篇文章的讨论范围之内。


  关于原型链的问题,大家需要理解的一点是,任何对象的原型链终点,都是 Object.prototype,可以把 Object 理解为所有对象的父类,类似于 JAVA 一样,所以说所有对象都可以调用一些 Object.prototype 上面的方法,比如 Object.prototype.valueOf() 以及 Object.prototype.toString() 等等。所有的 string 类型,其原型为 String.prototype ,String.prototype 是一个对象,所以其原型也就是 Object.prototype。这就是我们为什么能够在一个 string 类型的值上调用一些方法,比如 String.prototype.concat() 等等。同理所有数组类型的值其原型是 Array.prototype,数字类型的值其原型是 Number.prototype:


   理解了原型链的遍历操作,我们现在就可以学习如何添加属于自己的方法。我们现在知道了所有字符串的原型都是 String.prototype ,那么我们可以对其进行修改来设置我们自己的内置方法:


  所以说,在处理一些浏览器兼容性问题的时候,我们可以直接修改内置对象来兼容一些旧浏览器不支持的方法,比如 String.prototype.trim() :


  不过需要注意,切忌随意修改内置对象的原型方法,一是因为这会带来额外的内存消耗,二是这可能会在系统中造成一些隐患,一般只是用来做浏览器兼容的 polyfill 。


   for ... in 语句会遍历原型链上所有可枚举的属性(关于属性的可枚举性质,可以参考 java script 常量定义》),有时我们在操作的时候需要忽略掉原型链上的属性,只访问该对象上的属性,这时候我们可以使用 Object.prototype.hasOwnProperty() 方法来判断属性是否属于原型属性:


  我们知道通过 new 操作符创建的对象可以通过 instanceof 关键字来查看对象的“类”:


  实际上这个操作也是不严谨的,我们现在已经知道了 new 操作符在 java script 当中本是一个具有歧义设计,instanceof 操作符本身也是一个会让人误解的操作符,它并没有实例这种说法,实际上这个操作符只是判断了对象与函数原型的关联性,也就是说其返回的是表达式 object.__proto__ === function.prototype 的值。


  在这一段代码中,我们可以看出 obj 和 foo 并没有任何关系,只是 obj 的原型和 foo.prototype 关联到了同一个对象上面,所以其结果会返回 true。  


  不过对基本类型类型使用 instanceof 方法的话,可能会产生意外的结果:


  但是我们同样可以使用使用字面量调用原型的方法,这可能会让人感到困惑,不过我们不用担心它,并不是原型链出现什么毛病,而是在对基本类型进行字面量操作的时候,会涉及到隐式转换的问题。JS 引擎会先将字面量转换成内置对象,然后在调用上面的方法,隐式转换问题不在本文的讨论范围之类,大家可以参考 Kyle Simpson — 《你不知道的 java script (中卷)》。


  实际对象的 Object.prototype.isPrototypeOf() 方法更能体现出对象原型链的关系,此方法判断一个对象是否是另一个对象的原型,不同于 instanceof 的是,此方法会遍历原型链上所有的节点,若有匹配项则返回 true:


  在 ES5 当中拥有标准方法 Object.getPrototypeOf() 可以供我们获得一个对象的原型,在ES6 当中拥有新的方法 Object.setPrototypeOf() 可以设置一个对象的原型,不过在使用之前请先查看浏览器兼容性。


  我们现在知道,通过 new 操作符创建的对象,其原型会关联到函数的 [[prototype]] 上面,实际上这是一个很糟糕的写法,一味的贴合面向对象风格的编程模式,使得很多人无法领域 java script 当中的精髓。许多书籍都会写到 java script 中有许多奇怪的地方,然后教你如何避开这些地雷,实际上这不是一个好的做法,并不是因为 java script 是一门稀奇古怪的语言,而是我们不愿意去面对它的特性,正确的理解这些特性,才能让我们写出更加高效的程序。Object.create() 方法对于对象之间的关联和原型链的机制更加清晰,比 new 操作符更加能够理解 java script 的继承机制。该方法创建一个新对象,并使新对象的原型关联到参数对象当中:


  不过使用的时候还需要注意浏览器的兼容性,下面给出 MDN 上面的 polyfill:


  关于 Object.create() 方法要注意的一点是,如果参数为 null 那么会创建一个空链接的对象,由于这个对象没有任何原型链,所以说它不具有任何原生的方法,也无法进行原型的判断操作,这种特殊的对象常被称作“字典”,它完全不会受原型链的干扰,所以说适合用来存储数据:


  原型链是 java script 当中非常重要的一点,同时也是比较难理解的一点,因为其与传统的面向对象语言有着非常大的区别,但这是正是 java script 这门语言的精髓所在,关于原型与原型链,我们需要知道以下这几点:


  关于 java script 原型链,在一开始人们都称为“继承”,其实这是一种不严谨的说法,因为这不是标准的面向对象方法,不过初期人人常常这么理解。现在我往往称之为关联委托,关联指的是一个对象关联到另一个对象上,而委托则指的是一个对象可以调用另一个对象的方法。


  本篇文章均为个人理解,如有不足或纰漏,欢迎在评论区指出。


首页 上一页 1 2 下一页 尾页 2/2/2
】【打印繁体】【投稿】【收藏】 【推荐】【举报】【评论】 【关闭】 【返回顶部
上一篇JavaWeb项目实现文件上传动态显示.. 下一篇常见的排序算法总结(JavaScript)

最新文章

热门文章

Hot 文章

Python

C 语言

C++基础

大数据基础

linux编程基础

C/C++面试题目