funkcja map dla obiektów (zamiast tablic)

A może jedna linijka z natychmiastowym przypisaniem zmiennej w prostym JS ( ES6 / ES2015 )?

Korzystanie z operatora spreadu i obliczona nazwa klucza składnia:

let newObj = Object.assign({}, ...Object.keys(obj).map(k => ({[k]: obj[k] * obj[k]})));

Jsbin

Inna wersja z redukcją:

let newObj = Object.keys(obj).reduce((p, c) => ({...p, [c]: obj[c] * obj[c]}), {});

Jsbin

Pierwszy przykład jako funkcja:

const oMap = (o, f) => Object.assign({}, ...Object.keys(o).map(k => ({ [k]: f(o[k]) })));

// To square each value you can call it like this:
let mappedObj = oMap(myObj, (x) => x * x);

Jsbin

Jeśli chcesz odwzorować zagnieżdżony obiekt rekurencyjnie W funkcjonalny styl, można to zrobić tak:

const sqrObjRecursive = (obj) => 
  Object.keys(obj).reduce((newObj, key) => 
    (obj[key] && typeof obj[key] === 'object') ?
      {...newObj, [key]: sqrObjRecursive(obj[key])} :  // recurse.
      {...newObj, [key]: obj[key] * obj[key]}          // square val.
    ,{})       

Jsbin

Lub bardziej imperatywnie, jak to:

const sqrObjRecursive = (obj) => {
  Object.keys(obj).forEach(key => {
    if (typeof obj[key] === 'object') obj[key] = sqrObjRecursive(obj[key]);
    else obj[key] = obj[key] * obj[key]
  });
  return obj;
};

Jsbin

Od ES7 / ES2016 możesz użyć Object.entries zamiast Object.keys np. Tak:

let newObj = Object.assign(...Object.entries(obj).map(([k, v]) => ({[k]: v * v})));

Odziedziczone właściwości i łańcuch prototypów:

W niektórych rzadkich przypadkach może być konieczne mapowanie obiekt podobny do klasy , który posiada właściwości dziedziczone obiekt na swoim prototypowym łańcuchu . W takich przypadkach Object.keys() nie zadziała, ponieważ Object.keys()nie wylicza odziedziczonych właściwości. Jeśli chcesz odwzorować odziedziczone właściwości, powinieneś użyć for (key in myObj) {...}.

Oto przykład obiektu, który dziedziczy właściwości innego obiektu i jak Object.keys() nie działa w takim scenariuszu.

const obj1 = { 'a': 1, 'b': 2, 'c': 3}
const obj2 = Object.create(obj1);  // One of multiple ways to inherit an object in JS.

// Here you see how the properties of obj1 sit on the 'prototype' of obj2
console.log(obj2)  // Prints: obj2.__proto__ = { 'a': 1, 'b': 2, 'c': 3}

console.log(Object.keys(obj2));  // Prints: an empty Array.

for (key in obj2) {
  console.log(key);              // Prints: 'a', 'b', 'c'
}

Jsbin

Jednakże, proszę wyświadcz mi przysługę i unikaj dziedziczenia . :-)

Brak natywnych metod, ale lodash#mapValues wykona zadanie genialnie

_.mapValues({ 'a': 1, 'b': 2, 'c': 3} , function(num) { return num * 3; });
// → { 'a': 3, 'b': 6, 'c': 9 }

Całkiem łatwo napisać:

Object.map = function(o, f, ctx) {
    ctx = ctx || this;
    var result = {};
    Object.keys(o).forEach(function(k) {
        result[k] = f.call(ctx, o[k], k, o); 
    });
    return result;
}

Z przykładowym kodem:

> o = { a: 1, b: 2, c: 3 };
> r = Object.map(o, function(v, k, o) {
     return v * v;
  });
> r
{ a : 1, b: 4, c: 9 }

NB: Ta wersja umożliwia również (opcjonalnie) ustawienie kontekstu this dla wywołania zwrotnego, podobnie jak Metoda Array.

EDIT - zmieniono, aby usunąć użycie Object.prototype, Aby upewnić się, że nie koliduje z żadną istniejącą właściwością o nazwie map w obiekcie.

You could use Object.keys a następnie forEach nad zwracaną tablicą kluczy:

var myObject = { 'a': 1, 'b': 2, 'c': 3 },
    newObject = {};
Object.keys(myObject).forEach(function (key) {
    var value = myObject[key];
    newObject[key] = value * value;
});

Lub w bardziej modularny sposób:

function map(obj, callback) {
    var result = {};
    Object.keys(obj).forEach(function (key) {
        result[key] = callback.call(obj, obj[key], key, obj);
    });
    return result;
}

newObject = map(myObject, function(x) { return x * x; });

Zauważ, że Object.keys zwraca tablicę zawierającą tylko własne właściwości wyliczeniowe obiektu, więc zachowuje się ona jak pętla for..in z zaznaczeniem hasOwnProperty.

To proste bs, i wszyscy w społeczności JS o tym wiedzą. Istnieje powinna BYĆ ta funkcjonalność:

const obj1 = {a:4, b:7};
const obj2 = Object.map(obj1, (k,v) => v + 5);

console.log(obj1); // {a:4, b:7}
console.log(obj2); // {a:9, b:12}

Oto naiwna implementacja:

Object.map = function(obj, fn, ctx){

    const ret = {};

    Object.keys(obj).forEach(function(k){
        ret[k] = fn.call(ctx || null, k, obj[k]);
    });

    return ret;
};

To super irytujące, że trzeba to robić samemu cały czas;)

Jeśli chcesz czegoś bardziej wyrafinowanego, co nie koliduje z klasą Object, spróbuj tego:

let map = function (obj, fn, ctx) {
  return Object.keys(obj).reduce((a, b) => {
    a[b] = fn.call(ctx || null, b, obj[b]);
    return a;
  }, {});
};


const x = map({a: 2, b: 4}, (k,v) => {
    return v*2;
});

Ale jest to bezpieczne, aby dodać tę funkcję mapy do obiektu, po prostu nie dodawać do obiektu.prototyp.

Object.map = ... // fairly safe
Object.prototype.map ... // not ok

Przyszedłem tutaj, aby znaleźć i odpowiedzieć na mapowanie obiektu do tablicy i dostałem tę stronę w wyniku. W przypadku, gdy przyszedłeś tutaj szukając tej samej odpowiedzi, co ja, oto jak możesz mapować i obiektować tablicę.

Możesz użyć map, aby zwrócić nową tablicę z obiektu w następujący sposób:

var newObject = Object.keys(myObject).map(function(key) {
   return myObject[key];
});

Przyjęta odpowiedź ma dwie wady:

• źle wykorzystuje Array.prototype.reduce, ponieważ redukcja oznacza zmianę struktury typu kompozytowego, co w tym przypadku się nie zdarza.
Nie nadaje się szczególnie do wielokrotnego użytku]}

Podejście funkcjonalne ES6/ES2015

Należy pamiętać, że wszystkie funkcje są zdefiniowane w postaci skróconej.

// small, reusable auxiliary functions

const keys = o => Object.keys(o);

const assign = (...o) => Object.assign({}, ...o);

const map = f => xs => xs.map(x => f(x));

const mul = y => x => x * y;

const sqr = x => mul(x) (x);


// the actual map function

const omap = f => o => {
  o = assign(o); // A
  map(x => o[x] = f(o[x])) (keys(o)); // B
  return o;
};


// mock data

const o = {"a":1, "b":2, "c":3};


// and run

console.log(omap(sqr) (o));
console.log(omap(mul(10)) (o));

• w linii A o jest przypisany. Ponieważ Javascript przekazuje wartości referencyjne przez dzielenie , płytka Kopia o jest generowana. Jesteśmy teraz w stanie mutować o w obrębie omap bez mutowania o w zakresie nadrzędnym.
• w linii B map wartość zwracana jest ignorowana, ponieważ map wykonuje mutację o. Ponieważ ten efekt uboczny pozostaje wewnątrz omap i nie jest widoczny w zakresie nadrzędnym, jest całkowicie akceptowalny.

const omap = f => o => (o = assign(o), map(x => o[x] = f(o[x])) (keys(o)), o);

Dodatek-dlaczego obiekty domyślnie nie są iteracyjne?

ES2015 określiła protokoły iterator i iterable. Ale obiekty nadal nie są iterowalne, a zatem nie można ich mapować. powodem jest mieszanie danych i poziomu programu .

Dla maksymalnej wydajności.

Jeśli twój obiekt nie zmienia się często, ale wymaga częstej iteracji, sugeruję użycie natywnej Mapy jako pamięci podręcznej.

// example object
var obj = {a: 1, b: 2, c: 'something'};

// caching map
var objMap = new Map(Object.entries(obj));

// fast iteration on Map object
objMap.forEach((item, key) => {
  // do something with an item
  console.log(key, item);
});

Obiekt.wpisy już działa w Chrome, Edge, Firefox i beta Opera, więc jest to funkcja przyszłościowa. Jest z ES7 więc polyfill to https://github.com/es-shims/Object.entries dla IE, gdzie nie działa.

Wersja minimalna (es6):

Object.entries(obj).reduce((a, [k, v]) => (a[k] = v * v, a), {})

Ta odpowiedź została przepisana, aby zademonstrować potężny kombinator, który pozwala nam myśleć o naszej transformacji w inny sposób.]}

1. m, funkcja mapowanie – daje możliwość przekształcenia przychodzącego elementu przed...
2. r, redukcja funkcja-funkcja ta łączy akumulator z wynikiem odwzorowanego elementu

Intuicyjnie, mapReduce tworzy nowy reduktor, który możemy podłączyć bezpośrednio do Array.prototype.reduce. Ale co ważniejsze, możemy zaimplementować naszą implementację obiektowego functora omap w prosty sposób wykorzystując obiektowy monoid, Object.assign i {}.

const identity = x =>
  x
  
const first = (a, b) =>
  a
  
const mapReduce = (m = identity, r = first) =>
  (acc, x) => r (acc, m (x))
  
const omap = (o = {}, f = identity) =>
  Object.keys (o)
    .reduce ( mapReduce ( k => ({ [k]: f (o [k]) })  // Object.map
                        , Object.assign              // Object.concat
                        )
            , {}                                     // Object.empty
            )
          
const square = x =>
  x * x
  
const data =
  { a : 1, b : 2, c : 3 }
  
console.log (omap (data, square))
// { a : 1, b : 4, c : 9 }

Zauważ, że jedyną częścią programu, którą musieliśmy napisać, jest sama implementacja mapowania –

k => ({ [k]: f (o [k]) }

, który mówi, biorąc pod uwagę znany obiekt o i jakiś klucz k, skonstruować obiekt i którego właściwość k jest wynikiem wywołania f na wartości klucza, o [k].

Dostajemy przebłysk z mapReduce's potencjału sekwencjonowania, jeśli najpierw streszczenie oreduce

const oreduce = (o, f = first, acc = {}) =>
  Object.keys (o)
    .reduce ( mapReduce ( k => [ k, o[k] ]
                        , f
                        )
            , acc
            )

const omap = (o = {}, f = identity) =>
  oreduce ( o
          , mapReduce ( ([ k, v ]) => ({ [k]: f (v) })
                      , Object.assign
                      )
          , {}
          )

Wszystko działa tak samo, ale omap można teraz zdefiniować na wyższym poziomie. Oczywiście nowa Object.entries sprawia, że wygląda to głupio, ale ćwiczenie jest nadal ważne dla ucznia.

Nie zobaczysz pełnego potencjału mapReduce tutaj, ale podzielam tę odpowiedź, ponieważ interesujące jest to, ile miejsc można go zastosować. Jeśli interesuje cię, w jaki sposób jest pochodna i w jaki sposób może być przydatna, proszę zobacz tę odpowiedź .

map function nie istnieje na Object.prototype jednak można go tak emulować

var myMap = function ( obj, callback ) {

    var result = {};

    for ( var key in obj ) {
        if ( Object.prototype.hasOwnProperty.call( obj, key ) ) {
            if ( typeof callback === 'function' ) {
                result[ key ] = callback.call( obj, obj[ key ], key, obj );
            }
        }
    }

    return result;

};

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

var newObject = myMap( myObject, function ( value, key ) {
    return value * value;
});

Na podstawie odpowiedzi @Amberlamps, oto funkcja użytkowa (jako komentarz wyglądał brzydko)

function mapObject(obj, mapFunc){
    return Object.keys(obj).reduce(function(newObj, value) {
        newObj[value] = mapFunc(obj[value]);
        return newObj;
    }, {});
}

A użycie to:

var obj = {a:1, b:3, c:5}
function double(x){return x * 2}

var newObj = mapObject(obj, double);
//=>  {a: 2, b: 6, c: 10}

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


Object.prototype.map = function(fn){
    var oReturn = {};
    for (sCurObjectPropertyName in this) {
        oReturn[sCurObjectPropertyName] = fn(this[sCurObjectPropertyName], sCurObjectPropertyName);
    }
    return oReturn;
}
Object.defineProperty(Object.prototype,'map',{enumerable:false});





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


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

Natknąłem się na to jako pierwszy element w wyszukiwarce Google, próbując nauczyć się tego robić, i pomyślałem, że podzielę się dla innych folsk znalezienie tego niedawno rozwiązanie znalazłem, który używa pakietu npm immutable.

Myślę, że jest to interesujące, ponieważ immutable używa dokładnej sytuacji OP w ich własnej dokumentacji - poniższy kod nie jest moim własnym kodem, ale wyciągnięty z bieżącej dokumentacji immutable-js:

const { Seq } = require('immutable')
const myObject = { a: 1, b: 2, c: 3 }
Seq(myObject).map(x => x * x).toObject();
// { a: 1, b: 4, c: 9 } 

Nie to, że Seq ma inne właściwości ("Seq opisuje leniwe operacji, pozwalając im na efektywne wykorzystanie wszystkich metod zbierania wyższego rzędu (takich jak map i filter) przez nie tworzenie zbiorów pośrednich") i że niektóre inne niezmienne struktury danych-js mogą również wykonać zadanie dość efektywnie.

Każdy, kto używa tej metody, będzie oczywiście musiał {[1] } i może chcieć przeczytać dokumenty:

Https://facebook.github.io/immutable-js/

Jeśli interesuje Cię mapping nie tylko wartości ale także klucze, napisałem Object.map(valueMapper, keyMapper), tak się zachowuje:

var source = { a: 1, b: 2 };
function sum(x) { return x + x }

source.map(sum);            // returns { a: 2, b: 4 }
source.map(undefined, sum); // returns { aa: 1, bb: 2 }
source.map(sum, sum);       // returns { aa: 2, bb: 4 }

Hej napisał małą funkcję mapera, która może pomóc.

    function propertyMapper(object, src){
         for (var property in object) {   
           for (var sourceProp in src) {
               if(property === sourceProp){
                 if(Object.prototype.toString.call( property ) === '[object Array]'){
                   propertyMapper(object[property], src[sourceProp]);
                   }else{
                   object[property] = src[sourceProp];
                }
              }
            }
         }
      }

Potrzebowałem wersji, która pozwalała również na modyfikację kluczy (na podstawie odpowiedzi @Amberlamps i @yonatanmn);

var facts = [ // can be an object or array - see jsfiddle below
    {uuid:"asdfasdf",color:"red"},
    {uuid:"sdfgsdfg",color:"green"},
    {uuid:"dfghdfgh",color:"blue"}
];

var factObject = mapObject({}, facts, function(key, item) {
    return [item.uuid, {test:item.color, oldKey:key}];
});

function mapObject(empty, obj, mapFunc){
    return Object.keys(obj).reduce(function(newObj, key) {
        var kvPair = mapFunc(key, obj[key]);
        newObj[kvPair[0]] = kvPair[1];
        return newObj;
    }, empty);
}

FactObject=

{
"asdfasdf": {"color":"red","oldKey":"0"},
"sdfgsdfg": {"color":"green","oldKey":"1"},
"dfghdfgh": {"color":"blue","oldKey":"2"}
}

Edit: mała zmiana w celu przejścia w obiekcie startowym {}. Pozwala na [] (jeśli klucze są liczbami całkowitymi)

Chciałem użyć tej samej funkcji, której używałem dla tablic dla pojedynczego obiektu i chciałem, aby było to proste. To mi się udało:

var mapped = [item].map(myMapFunction).pop();

Możesz użyć prostej pętli for-in poprzez uporządkowane pary. Użyłem hasOwnProperty(), ponieważ utworzyłeś trzy właściwości (z wartościami) dla swojego obiektu. Pierwsza metoda nie tworzy mapy. Zamiast tego po prostu stosuje funkcję do pojedynczego elementu, co może znacznie przyspieszyć wykonanie w wielu sytuacjach.

Druga metoda tworzy mapę w podobny sposób jak pierwsza, ale prawdopodobnie jest dość wolniejsza niż niektóre inne odpowiedzi tutaj.

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

//Doesn't create a map, just applies the function to a specific element
function getValue(key) {
  for (var k in myObject) {
    if (myObject.hasOwnProperty(key)) {
      var value = myObject[key]
      return value * value; //stops iteration
    }
  }
}

//creates a map (answers question, but above function is better in some situations)
var newObject = {};
makeMap();

function makeMap() {
    for (var k in myObject) {
        var value = myObject[k];
        newObject[k] = value * value;
    }
}

console.log(newObject); //mapped array

Input: <input id="input" value="" placeholder="a, b or c"><br>
Output:<input id="output"><br>
<button onclick="output.value=getValue(input.value)" >Get value</button>

Możesz użyć metody map na tablicach, ale jeśli chcesz użyć jej na Object, możesz użyć jej Z twist jak poniżej:

var ob = { 'a': 2, 'b': 4, 'c': 6 };
$.map(ob, function (val, key) {
   ob[key] *= val;
});
console.log(ob) //it will log as {a: 4, b: 16, c: 36}

Lub możesz użyć innych pętli, takich jak metoda $.each Jak poniższy przykład:

$.each(ob,function (key, value) {
  ob[key] *= value;
});
console.log(ob) //it will also log as {a: 4, b: 16, c: 36}

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

const result = _.transform(orig, (r, v, k) => r[k.trim()] = v * 2);

console.log(result);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>

Użyj nowego _.transform() do przekształcenia obiektu .

Jeśli ktoś szukał prostego rozwiązania, które mapuje obiekt do nowego obiektu lub do tablicy:

// Maps an object to a new object by applying a function to each key+value pair.
// Takes the object to map and a function from (key, value) to mapped value.
const mapObject = (obj, fn) => {
    const newObj = {};
    Object.keys(obj).forEach(k => { newObj[k] = fn(k, obj[k]); });
    return newObj;
};

// Maps an object to a new array by applying a function to each key+value pair.
// Takes the object to map and a function from (key, value) to mapped value.
const mapObjectToArray = (obj, fn) => (
    Object.keys(obj).map(k => fn(k, obj[k]))
);

Może to nie działać dla wszystkich obiektów lub wszystkich funkcji mapowania, ale działa dla zwykłych, płytkich obiektów i prostych funkcji mapowania, co jest wszystkim, czego potrzebowałem.

Innym podejściem jest użycie niestandardowej funkcji JSON stringify, która może również działać na głębokich obiektach. Może to być przydatne, jeśli i tak zamierzasz opublikować go na serwerze jako json

const obj = { 'a': 1, 'b': 2, x: {'c': 3 }}
const json = JSON.stringify(obj, (k, v) => typeof v === 'number' ? v * v : v)

console.log(json)
console.log('back to json:', JSON.parse(json))