1. ホーム
  2. javascript

[解決済み] オブジェクトのためのマップ関数(配列の代わりに)

2022-03-15 07:19:17

質問

あるオブジェクトがあります。

myObject = { 'a': 1, 'b': 2, 'c': 3 }

のようなネイティブメソッドを探しています。 Array.prototype.map のように使用されます。

newObject = myObject.map(function (value, label) {
    return value * value;
});

// newObject is now { 'a': 1, 'b': 4, 'c': 9 }

JavaScriptにはこのような map 関数はありますか?(Node.JS用に欲しいので、クロスブラウザの問題は気にしません)。

どのように解決するのですか?

ネイティブの map には Object オブジェクトを作成しますが、こんなのはどうでしょう。

var myObject = { 'a': 1, 'b': 2, 'c': 3 };

Object.keys(myObject).map(function(key, index) {
  myObject[key] *= 2;
});

console.log(myObject);
// => { 'a': 2, 'b': 4, 'c': 6 }

しかし、オブジェクトに対する反復処理は for ... in :

var myObject = { 'a': 1, 'b': 2, 'c': 3 };

for (var key in myObject) {
  if (myObject.hasOwnProperty(key)) {
    myObject[key] *= 2;
  }
}

console.log(myObject);
// { 'a': 2, 'b': 4, 'c': 6 }

更新情報

多くの人が、これまでのメソッドは新しいオブジェクトを返すのではなく、オブジェクトそのものを操作していることに言及しています。それについては、新しいオブジェクトを返し、元のオブジェクトはそのままにしておく別の解決策を追加したいと思いました。

var myObject = { 'a': 1, 'b': 2, 'c': 3 };

// returns a new object with the values at each key mapped using mapFn(value)
function objectMap(object, mapFn) {
  return Object.keys(object).reduce(function(result, key) {
    result[key] = mapFn(object[key])
    return result
  }, {})
}

var newObject = objectMap(myObject, function(value) {
  return value * 2
})

console.log(newObject);
// => { 'a': 2, 'b': 4, 'c': 6 }

console.log(myObject);
// => { 'a': 1, 'b': 2, 'c': 3 }

Array.prototype.reduce は、以前の値を現在の値にいくらかマージすることで、配列を単一の値に縮小します。このチェーンは空のオブジェクト {} . 繰り返しごとに、新しいキー myObject が追加され、その2倍のキーが値として追加される。

更新

ES6の新機能により、よりエレガントな表現が可能になりました。 objectMap .

const objectMap = (obj, fn) =>
  Object.fromEntries(
    Object.entries(obj).map(
      ([k, v], i) => [k, fn(v, k, i)]
    )
  )
  
const myObject = { a: 1, b: 2, c: 3 }

console.log(objectMap(myObject, v => 2 * v))