重新审视在ECMAScript 5之后扩展原生原型

在ECMAScript 5之后，扩展原生原型是一种常见的做法，可以为原生对象添加新的方法和属性。这可以让我们更方便地使用这些对象，并且可以让我们的代码更加简洁和易于维护。

以下是一些常见的扩展原生原型的方法：

使用Object.defineProperty()方法：这个方法可以为对象定义一个新的属性，并且可以指定该属性的可配置性、可枚举性、可写性和值。例如，为Array对象添加一个新的方法：

Object.defineProperty(Array.prototype, 'myMethod', {
  value: function() {
    // 方法的实现
  },
  writable: true,
  configurable: true,
  enumerable: false
});

使用Object.defineProperties()方法：这个方法可以为对象定义多个新的属性，并且可以指定每个属性的可配置性、可枚举性、可写性和值。例如，为String对象添加两个新的属性：

Object.defineProperties(String.prototype, {
  myProperty1: {
    value: 'myProperty1Value',
    writable: true,
    configurable: true,
    enumerable: false
  },
  myProperty2: {
    value: 'myProperty2Value',
    writable: true,
    configurable: true,
    enumerable: false
  }
});

使用Object.assign()方法：这个方法可以将一个或多个对象的属性复制到另一个对象上。例如，为Date对象添加一个新的方法：

Object.assign(Date.prototype, {
  myMethod: function() {
    // 方法的实现
  }
});

需要注意的是，扩展原生原型需要谨慎使用，因为这可能会导致命名冲突和代码的可读性降低。在扩展原生原型之前，应该考虑是否有更好的方法来实现相同的功能，并且应该遵循一些最佳实践，例如使用命名空间和避免使用保留字。

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

在对象的原型上添加方法？

HTML5学堂：利利前段时间写了几个数组、字符串的方法，其中有一个是克隆（复制）一个数组。于是，最近一直在琢磨如何让这个复制变得更简单，可不可以把这个自定义的方法挂载在原型上呢？...在对象的原型上添加方法是否合理？仔细思考之后，并查阅了一些相关资料，利利最终还是放弃了将方法添加到对象的原型上，为什么呢？...但是，当方法挂载在了原型上时，我们可能就很难发现问题的所在。简言之就是：出现Bug时，不容易进行问题的定位。...但是DOM 后来原生方法里对这个方法返回的是一个Nodelist实例，结果就是之前用了Prototype库的代码，运行在新浏览器的时候，用的是DOM原生方法，返回的对象是无法继承数组的任何方法的，所以就会报错...“复制”各类变量的功能封装虽然放弃了将变量“复制”的功能放在原型上，但是依旧打算对这个功能进行一些扩展，封装一个能够克隆数字、字符串、数组、对象等多种数据的功能函数，岂不是更好？

9835 0

全面理解面向对象的 JavaScript

把握好这一点之后，才有可能进一步使用好这门语言。...谁调用我，我属于谁：str 在接受了面向对象存在一种叫做基于原型实现的方式的事实之后，下面我们就可以来深入探讨 ECMAScript 是如何依据这一方式构造自己的语言的。...理解了原型链，那么将非常容易理解 JS 中基于原型的继承实现原理，程序清单 5 是利用原型链实现继承的简单例子。清单 5....JavaScript 类式继承的实现方法从代码清单 5 可以看出，基于原型的继承方式，虽然实现了代码复用，但其行文松散且不够流畅，可阅读性差，不利于实现扩展和对源代码进行有效地组织管理。...其实，在众多框架出现之前，JavaScript 大师 Douglas Crockford 最早利用三个函数对 Function 对象进行扩展，实现了这种变换，关于它的实现细节可以（参考资源）。

1K10 0

JavaScript 继承

二、原型链（prototype chaining）继承原理：继承这种形式在 ECMAScript 中原本是用于原型链的，prototype 对象是个模板，要实例化的对象都以这个模板为基础，prototype...原型链利用这种功能来实现继承机制。与对象冒充相似，子类的所有属性和方法都必须出现在 prototype 属性被赋值后，因为在它之前赋值的所有方法都会被删除。为什么？...,可以自定义原生数据结构（比如 Array、String 等）的子类，这是 ES5 无法做到的。...extends 关键字不仅可以用来继承类，还可以用来继承原生的构造函数。...因此可以在原生数据结构的基础上，定义自己的数据结构. class SuperArray extends Array { constructor() { super(); this.history

3072 0

ECMA-262-3深入解析第七章：2、OOP ECMAScript 实现

Note：ES5标准定化了静态对象，不能用新属性扩展，任何属性也不能被修改或者删除。这些成为冻结对象，可以通过 Object.freeze(o) 方法获得。...内置，原生与宿主对象有必要注意的是，规范区分了本地对象，内置对象以及宿主对象。内置对象和原生对象是由ECMAScript规范和实现定义，他们之前的区别不明显。...原生对象是ECMAScript实现提供的所有对象（其中一些可以内置，一些可以在程序执行期间创建，例如用户定义的对象）。...内置对象可以算是原生对象的一个子类，在程序开始之前已经内置到了ECMAScript中（例如 parseInt ， Math 等）。...新的原型只有在这个修改以后创建的新对象才有。这里主要的规则是：对象的原型是在对象创建那一刻设置的，并且在那之后不能被修改为新对象。

5762 0

详解JavaScript的继承和原型链(prototype)

Object.getPrototypeOf(o)); // 3、此种方式设置上层对象的属性，会覆盖掉所有旧属性，慎用 console.log(Object.setPrototypeOf(o, {e:5}...三、继承继承也是基于原型链的特性。ECMAScript6 引入 class 关键字来实现类对象，但类对象也是基于原型链。...，在原型链上查找属性比较耗时，对性能有副作用。...2、错误实践扩展内置原型会破坏封装，这不是好的解决方案，使用扩展内置原型的唯一理由是支持 JavaScript 引擎的新特性，如 Array.forEach。...原生原型不应该被扩展，除非它是为了与新的 JavaScript 特性兼容。五、参考文档详解JavaScript的继承和原型链(prototype)

5121 0

JavaScript(七)

这个特性的默认值为 undefined 要修改属性默认的特性，必须使用 ECMAScript 5 的 Object.defineProperty() 方法。...原型模式的重要性不仅体现在创建自定义类型方面，就连所有原生的引用类型，都是采用这种模式创建的。...所有原生引用类型(Object、Array、String 等等)都在其构造函数的原型上定义了方法。...继承 ECMAScript 只支持实现继承，而且其实现继承主要是依靠原型链来实现的。原型链 ECMAScript 中描述了原型链的概念，并将原型链作为实现继承的主要方法。...但不管怎样，给原型添加方法的代码一定要放在替换原型的语句之后。

2941 0

es3-es10整理

ECMAScript es3（ECMAScript 1999） 1999年，ECMAScript第三个版本 es4（ECMAScript 2007） ECMAScript第四个版本，废弃 es5（ECMAScript...writable: true }, 'property2': { value: 'Hello', writable: false } }); Object.keys 在ES5...但其对象类型的原型依然可以添加新的属性。该方法使得目标对象的 [[prototype]] 不可变；任何重新赋值 [[prototype]] 操作都会抛出 TypeError 。...__proto__ = { oh: 'hai' }; Object.isExtensible Object.isExtensible() 方法判断一个对象是否是可扩展的（是否可以在它上面添加新的属性）。...尝试删除一个密封对象的属性或者将某个密封对象的属性从数据属性转换成访问器属性，结果会静默失败或抛出TypeError（在严格模式中最常见的，但不唯一）。不会影响从原型链上继承的属性。

1.4K2 0

学了这么久，你不会还不知道ECMAScript发展历程吧

以下是 ECMAScript 的一些特点：脚本语言： ECMAScript 是一种解释性的脚本语言，不需要编译成二进制代码就可以在支持它的环境中运行。...原型继承： JavaScript 使用原型继承机制，允许对象直接从其他对象继承属性，而不需要使用类的概念。...开放性： ECMAScript 是一个开放标准，允许开发者通过各种方式扩展语言的功能。...标准规范ECMA-262，从此浏览器厂商都是按照这个规范来开发自己的浏览器产品；1999年12月ES3发布，到2011年6月ES5发布（2007年的ES4夭折：改动太大），ES3占据了10年历程，也是JS...2015年6月ES6发布（但是由于之后规定每年发布一个新的版本，所以后改名ES2015），2016年6月对2015版本增强的2016版本发布，此后相继有ES2017、ES2018…ES2015(ES6)

1161 0

JavaScript技术可以分三类 — 学习JS必须了解的精髓

在书写一些效果时，这部分知识在其中充当的是功能的核心代码，但是如果仅仅依靠此类知识，代码书写出来的冗余度会很高，扩展性也很差。...学好了原生的JS，对于框架类的知识的掌握速度会有质的提升）简要概括： JS实现功能很简单，但是想做好很难，而“做好”是JS的精髓。掌握了基本的DOM操作之后，就需要不断考虑代码优化。...学习顺序的重要性最后，说说学习顺序的重要性吧，HTML5学堂的成员们一致认为这个学习顺序至关重要。...利利表示：自己大概是在2009年开始学习JS，当时用的是一本叫做《JavaScript征途》的书籍，自学了1年的时间之后，虽然对各类方法有一定的了解，但是在一些效果实现上实在是很没思路，并不知道从何下手...甚至~~~自学一年之后，自己都不知道JS文件如何引入到HTML文件当中，只是在html文件当中书写JS代码，唉，郁闷的也是不要不要的~（有点儿感觉像是在吐槽当前书籍像字典的感觉啊~~~）学习顺序和方法能够让我们事半功倍

7679 1

JavaScript创建对象的7种模式

2）构造函数模式 ECMAScript 中的构造函数可用来创建特定类型的对象，例如Object 和 Array 这样的原生构造函 function Person(name, age, job){ this.name...默认情况下，原生的 constructor 属性是不可枚举的，因此如果你使用兼容 ECMAScript 5 的 JavaScript 引擎，可以试一试 Object.defineProperty() 。...// 重设构造函数，只适用于 ECMAScript 5 兼容的浏览器Object.defineProperty(Person.prototype, "constructor", { enumerable...5. 原生对象的原型原型模式的重要性不仅体现在创建自定义类型方面，就连所有原生的引用类型，都是采用这种模式创建的。...ECMAScript中使用最广泛、认同度最高的一种创建自定义类型的方法 5）动态原型模式动态原型模式致力于解决这样一个问题，它把所有信息都封装在了构造函数中，而通过在构造函数中初始化原型（仅在必要的情况下

7765 0

《JavaScript高级程序设计》学习笔记(5)——面向对象编程

每个对象都是基于一个引用类型创建的，这个引用类型可以是前面讨论的原生类型，也可以是开发人员定义的类型。 2、属性类型：ECMA-262第5版在定义只有内部才用的特性时，描述了属性的各种特征。...要修改属性默认的特性，必须使用ECMAScript5的Object.defineProperty()方法。这个方法接收三个参数：属性所在的对象、属性的名字和一个描述符对象。...} } }); book.year = 2005; alert(book.edition);//2 由于为对象定义多个属性的可能性很大，ECMAScript5...this.edition += newValue - 2004; } } } }); 读取属性的特性：使用ECMAScript5...考虑到在ECMAScript中无法创建类，开发人员就发明了一种函数，用函数来封装以特定接口创建对象的细节。

7029 0

JavaScript之面向对象学习三原型语法升级

22, job:"coder", sayName:function(){ alert(this.name); } } 改进之后的原型语法将...因为当我们每创建一个函数,同时就会创建一个prototype属性对象(原型属性对象)，而这个对象会自动获得constructor属性。...); //输出：true constructor:Person,=》在对象里面自定义了constructor属性,并让它指向了Person函数 // 所以person.constructor重新指向了...Person，而不是Object 注意:以上这种方式添加constructor属性会导致它的[[Enumerable]]设为true，而原生的constructor属性是不可枚举的,所以我们需要用ECMAScript...5中定义的Object.definePropery()方法来重新定义constructor属性,使他变成不可枚举的属性,且值是指向对象构造函数的指针，代码如下: function Person(

4289 0

javascipt

理解ES 全称: ECMAScript js语言的规范我们用的js是它的实现 js的组成 ECMAScript(js基础) 扩展-->浏览器端 BOM DOM 扩展-->服务器端 Node.js...ES5 严格模式运行模式: 正常(混杂)模式与严格模式应用上严格式: 'strict mode'; 作用: 使得Javascript在更严格的条件下运行消除Javascript语法的一些不合理、...Object.create(prototype[, descriptors]) : 创建一个新的对象以指定对象为原型创建新的对象指定新的属性, 并对属性进行描述 value : 指定值 writable..., 阅读性很差) 能以同步编码的方式实现异步调用在es6之前原生的js中是没这种实现的, 一些第三方框架(jQuery)实现了promise ES6中定义实现API: // 1....用 constructor() 定义构造方法(相当于构造函数) 一般方法: xxx () {} 用extends来定义子类用super()来父类的构造方法子类方法自定义: 将从父类中继承来的方法重新实现一遍

1.2K2 0

Javascript对象

默认为undefined 要修改属性的默认特性必须使用ECMAScript5的Object.defineProperty()方法。...默认undefined [[Set]]:在写入属性的时候调用的函数。...__year = newValue; this.edition += newValue - 2016; } } } }); 读取属性的特性使用ECMAScript5...4.组合使用构造函数模式和原型模式 5.动态原型模式 6.寄生构造函数模式 7.稳妥构造函数模式 ---- 继承许多OO语言都支持两种继承方式：接口继承:继承方法签名实现继承:继承实际方法 JavaScript...支持实现继承，且继承方式是依靠原型链实现的（es6的class类已经支持继承） 1.原型链继承 2.借用构造函数实现继承 3.组合继承 4.原型式继承 5.寄生继承 6.寄生组合式继承

3821 0

《JavaScript高级程序设计》读书笔记

ECMAScript 实现的宿主环境之一，其他环境包括 Node、Adobe Flash DOM：是针对 XML 经过扩展用于 HTML 的程序编程 API BOM：控制浏览器显示的页面以外部分第二章...2.2 可扩展超文本标记语言 XHTML XHTML 编写比 HTML 更严格，例如 > 等符号都需要转义。为了保证 js 正常运行，用 CDATA 来包裹。...增加了严格模式，它是“编译指示”，用来告知 Js 引擎切换到严格模式，需要在代码顶部添加："use strict"; 3.2 关键字和保留字保留字是之后可能被用作关键字的标识符。...，而且不能影响原有原型链。...location.reload(true)：强制重新加载。

1.1K2 0

面向 JavaScript 开发人员的 ECMAScript 6 指南（3）：JavaScript 中的类

在第 2 部分中，您学习了 ECMAScript 6 中的函数增强，包括新的箭头和生成器函数。将函数元素集成到 JavaScript 代码中意味着要重新考虑某些因素，但变化没有您想象的那么大。...事实上，在多年来提出的所有变化中，ECMAScript 6 中最有争议的新元素或许就是面向对象的元素。...事实上，属性的封装性质很大程度上是为了部分或完整地隐藏内部状态：清单 5....原型继承作为一种模式，“跟随原型链” 使 ECMAScript 6 的继承规则非常容易理解。如果您创建一个扩展另一个类的类，很容易想到在派生类上调用该实例方法时发生的情况。清单 11....如果失败，那么它会检查类型对象（在本例中为 Author）。接下来，将会检查类型对象的 “扩展” 对象 (Person)，依此类推，直到返回到最初的类型对象，该对象始终是 Object。

6634 0

设计模式

正因为这样，可以把ECMAScript的对象想象成散列表：无非就是一组名值对，其中值可以是数据或函数。每个对象都是基于一个引用类型创建的，这个引用类型可以是原生类型，也可以是开发人员定义的类型。...3、构造函数模式 ECMAScript中的构造函数可用来创建特定类型的对象。像Object和Array这样的原生构造函数，在运行时会自动出现在执行环境中。...5、混合模式(原型模式 + 构造函数模式) 创建自定义对象类型的最常见方式，就是组合使用构造函数模式与原型模式。构造函数模式用于定义实例属性，而原型模式用于定义方法和共享的属性。...，是目前在ECMAScript中是使用最广泛、认同度最高的一种创建自定义对象的方法。...或者如果想在动画的每一帧完成之后做一些事情,那我们可以订阅一个事件,然后在动画的每一帧完成之后发布这个事件。

3912 0

ES6【笔记】

（尤其是在ES5中，arguments并不是一个真正的数组，而是一个类数组的对象，但是扩展运算符的逆运算却可以返回一个真正的数组）。...ES6在Object原型上新增了assign()方法，用于对象新增属性或者多个对象合并。...ES6在Object原型上新增了getOwnPropertyDescriptors()方法，此方法增强了ES5中getOwnPropertyDescriptor()方法，可以获取指定对象所有自身属性的描述对象...其次就是因为Proxy可以改写默认的原生API，如果一旦原生API别改写可能就找不到了，所以Reflect也可以起到备份原生API的作用，使得即使原生API被改写了之后，也可以在被改写之后的API用上默认的...c.ES6的class类不存在变量提升，必须先定义class之后才能实例化，不像ES5中可以将构造函数写在实例化之后。

4072 0

ES6面试、复习干货知识点汇总

5153 0

JavaScript权威指南 - 对象

如果允许属性赋值，也只是在原始对象上创建或对已有的属性赋值，而不会修改原型链。 JavaScript中，一般只有在查询属性的时候才能体会到继承的存在，而设置属性和继承无关。...属性的特性 ECMAScript 3版本下对象的属性都是否可写、可配置和可枚举的，但是到ECMAScript 5版本下是属性是可以通过一些API来标识是否为可写、可配置和可枚举的。...在ES5版本中，将对象传入Object.getPrototypeOf()方法可以查询它的原型对象。想要检测一个对象是否是另一个对象的原型可以使用isPrototypeOf()方法。...ECMAScript 5版本中，所有自定义对象、内置对象和宿主对象默认支持可扩展性。下面介绍几个检测和设置对象可扩展性的方法以及它们之间的区别。...需要注意的两点是：1.一旦对象转为不可扩展的，就无法再将其转换成可扩展的；2.如果给一个不可扩展的对象的原型添加属性，这个不可扩展的对象同样会继承这些新属性。

1.1K2 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云