javascript 数组更改侦听器
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/13825929/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Array change listener
提问by Adrian Bartholomew
Possible Duplicate:
Javascript - How to extend Array.prototype.push()?
How can I be notified (run a pre-defined function) of any change to a registered array (or at least any addition or removal of elements)? I tried using prototype. I don't want to be scolded for not providing SOME code examples of my own. So here's how I would liketo use it.
如何通知（运行预定义函数）已注册数组的任何更改（或至少添加或删除元素）？我尝试使用原型。我不想因为没有提供我自己的一些代码示例而被骂。因此，这里是我怎么会喜欢使用它。
var myArray = [];
myArray.bind(function() {
console.log('wtf'); // Wed Thu Fri and what were you thinking?
});
I don't need overkill. I basically know the Array function scope that I will be using (push, pop, splice and maybe a couple others). It's a way to use backbone's MVC. I want to run logic on an array and THEN have the views highlighted accordingly. But the view is already attached to a collection. Any change to that collection re-renders the actual DOM's in the view. I don't want that. I simple want to add, or remove, a class to the corresponding DOM's in the view for CSS purposes.
我不需要矫枉过正。我基本上知道我将使用的 Array 函数作用域（push、pop、splice 和其他一些）。这是使用主干MVC的一种方式。我想在数组上运行逻辑，然后相应地突出显示视图。但是该视图已经附加到一个集合中。对该集合的任何更改都会重新呈现视图中的实际 DOM。我不想要那个。我只是想为 CSS 目的在视图中的相应 DOM 中添加或删除一个类。
回答by Naftali aka Neal
What I did is I made my own "array" type that just extended the prototype array, which then I added my own handlers to.
我所做的是创建了我自己的“数组”类型，它只是扩展了原型数组，然后我添加了我自己的处理程序。
For example:
例如：
var MyArray = function() {
var arr = [];
arr.push = function() {
console.log("PUSHING", arguments);
return Array.prototype.push.apply(this, arguments);
}
return arr;
};
Usage:
用法：
var arr = new MyArray;
arr.push(12, 3, 45);
...
回答by pimvdb
You're looking for Object.observe, but it's not widely available yet. In Chrome Canary, with "Experimental JavaScript" enabled on about:flags you can try the following:
您正在寻找Object.observe，但尚未广泛使用。在 Chrome Canary 中，在 about:flags 上启用“Experimental JavaScript”后，您可以尝试以下操作：
?var arr = [];
?Object.observe(arr, function(changes) {
console.log("The array changed. Changes:", changes);
});
回答by svidgen
Something like this will set up global monitoring of array push()'s.
这样的事情将设置数组 push() 的全局监控。
(function() {
var _push = Array.prototype.push;
Array.prototype.push = function() {
console.log("push");
return _push.apply(this, arguments);
}
})();
Otherwise, as Neal suggested, you can create another class.
否则，正如尼尔建议的那样，您可以创建另一个类。
var MonitoredArray = function() {
var rv = [];
var _push = rv.push;
rv.push = function() {
console.log("push()");
console.log(arguments);
return _push.apply(this, arguments);
}
return rv;
}
To set up basicmonitoring of N function calls at once.
一次设置N个函数调用的基本监控。
var MonitoredArray = function() {
var rv = [];
// the names of the functions we want to log:
var logged_fns = ["push", "pop"];
for (var i in logged_fns) { (function() {
var name = logged_fns[i]
var fn = rv[name];
rv[name] = function() {
console.log(name + "()");
console.log(arguments);
return fn.apply(rv, arguments);
}
})()}
return rv;
}
A similar adaptation should work for the first example too.
类似的改编也应该适用于第一个示例。
