添加到 JavaScript 对象的方法 Class 在遍历给定对象时出现

Question

在 JavaScript 变得更强大的过程中，我接受了一项挑战，即向 JavaScript 对象 class 添加方法 myMethod()在给定对象 myObject 上调用，以操纵其内容。

我已经将 myMethod() 添加到对象原型并通过 myObject.myMethod() 遍历 myObject；然而，我运行陷入了一个奇怪的问题：在给定对象的末尾， myMethod() 被打印为 myObject 的值，尽管据我所知，它不应该是.

Object.prototype.myMethod = function()
{
    for (var key in this)
    {
        console.log(this[key]);
    }
}


function processData(input)
{
    //Enter your code here
    var myObject = JSON.parse("{ \"myParam\": \"myValue\", \"anotherParam\": 123 }");
    myObject.myMethod();
}

以下是这段代码的输出：

myValue
123
[Function]

将 myObject[key] 更改为 myObject[key].toString() 会产生以下输出：

myValue
123
function ()
{
    for (var key in this)
    {
        console.log(this[key].toString());
    }
}

我正在使用 Node.js 运行时在 WebStorm 中执行此脚本。

这个挑战的要求只要求 myObject 的内容，我不知道如何阻止 myMethod() 出现在这里。有什么我想念的吗？

Answer 1

In my journey to become stronger in JavaScript, I have taken up a challenge to add a method, myMethod(), to the JavaScript Object class that can be called on a given Object, myObject, in order to manipulate its contents.

请注意，这种做法严重不受欢迎（在 2017 年，可能比绝对必要的更多*）。扩展任何内置原型都有些麻烦，但扩展 Object.prototype 尤其成问题，因为当然，几乎所有对象都继承自它。

但是如果你要扩展原型，重要的是通过 Object.defineProperty 或类似的方式添加 non-enumerable 属性:

Object.defineProperty(Object.prototype, "myMethod", {
    value: function() { /* ... */ }
});

enumerable 的默认值是 false，因此它不会出现在 for-in 循环、Object.keys 数组等中

* "don't extend built-in prototypes" 咒语开始于 ES5 引入定义不可枚举属性的方法（例如，defineProperty）之前。现在我们可以定义不可枚举的属性，主要关注的是脚本间冲突，每个脚本都试图对某些东西使用相同的名称，或者与添加到 JavaScript.[=24= 的新功能发生冲突。 ]

Answer 2

使用Object.defineProperty().

对象 class 在许多库和框架中都有使用，因此最好单独放置，但对于浏览器兼容性的多边形填充等内容很有用。

if (!Object.prototype.myMethod) {
    Object.defineProperty(Object.prototype, 'myMethod', {
        value: function() { /* customer code here */ }
    })
}

添加到 JavaScript 对象的方法 Class 在遍历给定对象时出现

Method Added to JavaScript Object Class Appears when Traversing through Given Object

javascript

json

node.js

webstorm