複数のオブジェクトをグループ化するなどして、単一の機能を複数のオブジェクトに対して実行することは可能ですか。私がやりたいことは次のようなものです:
{object1, object2, object3}.toFront();
複数のオブジェクトをグループ化するなどして、単一の機能を複数のオブジェクトに対して実行することは可能ですか。私がやりたいことは次のようなものです:
{object1, object2, object3}.toFront();
簡単な方法:
var nodes = [node.rectangle1, node.text, node.rectangle2];
for (var i = 0; i < nodes.length; i++) {
nodes[i].toFront();
}
アンダースコアを使用して簡潔にしたい場合:
_.invoke([node.rectangle1, node.text, node.rectangle2], 'toFront');
戻り値が必要な場合はmapを使用するか、追加の処理が必要な場合はeachを参照してください。
編集(これを完全にするため):
アンダースコアと非常によく似た方法で、ビルトインを使用することもできforEach
ます (一部のブラウザーを気にしない場合、またはそれをシムすることを選択した場合) each
。
[node.rectangle1, node.text, node.rectangle2].forEach(function(el) {
el.toFront();
});
すでに回答を受け入れていますが、JavaScript 1.6/ECMAScript 5 th Editionを介してネイティブに同様の方法でこれを行うことができます。
function logElementID(element, index, array) {
var el = array[index],
prop = el.textContent ? 'textContent' : 'innerText';
el[prop] = el.id;
}
[document.getElementById('one'), document.getElementById('two')].forEach(logElementID);
Object
または、プロトタイプを拡張することによって:
function doStuff (el) {
console.log(el);
};
Object.prototype.actOnGroup = function(func){
var els = this.length ? this : [this];
for (var i = 0, len = els.length; i<len; i++){
func(els[i]);
}
return this;
};
document.getElementsByTagName('div').actOnGroup(doStuff);
document.getElementById('one').actOnGroup(doStuff);
または、同様に、Array
プロトタイプを拡張することによって:
function doStuff (el) {
console.log(el);
};
Array.prototype.actOnGroup = function(func){
var els = this.length ? this : [this];
for (var i = 0, len = els.length; i<len; i++){
func(els[i]);
}
return this;
};
[document.getElementById('one'), document.getElementById('two')].actOnGroup(doStuff);
forEach()
ちなみに、 (比較的) 最新の JavaScript 実装を持たないユーザーに代替手段を提供したい場合、Mozilla Developer Network のページでforEach()
は、「[an] algorithm 100% true to the ECMA-262, 5th版':
// Production steps of ECMA-262, Edition 5, 15.4.4.18
// Reference: http://es5.github.com/#x15.4.4.18
if (!Array.prototype.forEach) {
Array.prototype.forEach = function forEach(callback, thisArg) {
var T, k;
if (this == null) {
throw new TypeError("this is null or not defined");
}
// 1. Let O be the result of calling ToObject passing the |this| value as the argument.
var O = Object(this);
// 2. Let lenValue be the result of calling the Get internal method of O with the argument "length".
// 3. Let len be ToUint32(lenValue).
var len = O.length >>> 0; // Hack to convert O.length to a UInt32
// 4. If IsCallable(callback) is false, throw a TypeError exception.
// See: http://es5.github.com/#x9.11
if ({}.toString.call(callback) !== "[object Function]") {
throw new TypeError(callback + " is not a function");
}
// 5. If thisArg was supplied, let T be thisArg; else let T be undefined.
if (thisArg) {
T = thisArg;
}
// 6. Let k be 0
k = 0;
// 7. Repeat, while k < len
while (k < len) {
var kValue;
// a. Let Pk be ToString(k).
// This is implicit for LHS operands of the in operator
// b. Let kPresent be the result of calling the HasProperty internal method of O with argument Pk.
// This step can be combined with c
// c. If kPresent is true, then
if (Object.prototype.hasOwnProperty.call(O, k)) {
// i. Let kValue be the result of calling the Get internal method of O with argument Pk.
kValue = O[k];
// ii. Call the Call internal method of callback with T as the this value and
// argument list containing kValue, k, and O.
callback.call(T, kValue, k, O);
}
// d. Increase k by 1.
k++;
}
// 8. return undefined
};
}
forEach()
MDN記事の参照 (以下) から逐語的にコピー。2013 年 4 月 1 日、14:30。
参考文献: