Convertendo um objeto JS em uma matriz usando jQuery

417

Meu aplicativo cria um objeto JavaScript, como o seguinte:

myObj= {1:[Array-Data], 2:[Array-Data]}

Mas eu preciso desse objeto como uma matriz.

array[1]:[Array-Data]
array[2]:[Array-Data]

Então, tentei converter esse objeto em uma matriz iterando $.eachatravés do objeto e adicionando o elemento a uma matriz:

x=[]
$.each(myObj, function(i,n) {
    x.push(n);});

Existe uma maneira melhor de converter um objeto em uma matriz ou talvez uma função?

The Bndr
fonte
1
Os índices da matriz devem ser os mesmos que as chaves no objeto original? O primeiro índice de uma matriz é sempre 0, mas seu próprio código e a maioria das respostas (incluindo a aceita) parecem ignorá-lo; ainda assim, você reverteu minha edição para o resultado de exemplo desejado.
11554 Imre
1
Sim, você está certo: o primeiro elemento Array começa com 0. Mas eu reverti sua edição, porque, aos meus olhos, não era consistente manter esse exemplo o mais simples possível, porque alterar myObj= {1:[Array-Data]para myObj= {0:[Array-Data]não fazia parte da sua edição (como eu lembro direito)
O BNDR
3
Use o jQuery $ .makeArray (obj) de comando para que api.jquery.com/jQuery.makeArray
DevlshOne
@DevlshOne a documentação u fornecido diz: "Vire um objeto jQuery em uma matriz" Eu não acho que isso se encaixa na questão OP
Alex

Respostas:

429
var myObj = {
    1: [1, 2, 3],
    2: [4, 5, 6]
};

var array = $.map(myObj, function(value, index) {
    return [value];
});


console.log(array);

Resultado:

[[1, 2, 3], [4, 5, 6]]
Dogbert
fonte
8
@ Dogbert, por favor, você poderia explicar o $.map? Toda pesquisa que eu tento fazer sobre isso gera muitos links para o jQuery ou o método map de matrizes.
22468 crantok
21
D'oh! Ignore meu comentário. Eu não tinha notado a tag jQuery nesta questão.
crantok
8
existe uma maneira de manter as chaves na nova matriz? cada resposta no www que vejo não tem a conversão de chaves.
TD_Nijboer
55
Você também pode fazer isso sem jQuery: Object.keys (myObject) .map (function (val) {return [val]});
Kris Erickson
3
@TD_Nijboer Sim, use em value.key = index; return [value];vez dereturn [value];
Simon Arnold
742

Se você está procurando uma abordagem funcional:

var obj = {1: 11, 2: 22};
var arr = Object.keys(obj).map(function (key) { return obj[key]; });

Resulta em:

[11, 22]

O mesmo com uma função de seta ES6:

Object.keys(obj).map(key => obj[key])

Com o ES7, você poderá usar Object.values( mais informações ):

var arr = Object.values(obj);

Ou se você já estiver usando Underscore / Lo-Dash:

var arr = _.values(obj)
Joel Richard
fonte
3
Insatisfeito com a resposta principal, acabei de escrever essa função quase exata, voltei a publicá-la como resposta, rolei para baixo e vi 170. Realizado, cara Se eu não tivesse desistido, não teria que pensar :) Isso deve estar no topo. OP pls selecione como resposta.
J03m #
1
para alguém para quem isso não é óbvio, as chaves não precisam ser seqüenciais (ou seja, neste exemplo, elas são 1 e 2 - mas poderiam ser também uma chave de seqüência de caracteres ou um número não seqüencial)
Simon_Weaver
Para o primeiro parágrafo do código, falto ponto e vírgula. Não sei por que.
precisa saber é o seguinte
@JohnnyBizzle Acho que o seu ponteiro precisa escrever "return obj [key];" com um ponto e vírgula no final. O JavaScript não.
Joel Richard
30

Eu acho que você pode usar, for inmas verificando se a propriedade não está inerithed

myObj= {1:[Array-Data], 2:[Array-Data]}
var arr =[];
for( var i in myObj ) {
    if (myObj.hasOwnProperty(i)){
       arr.push(myObj[i]);
    }
}

EDIT - se você quiser, também pode manter os índices do seu objeto, mas você deve verificar se eles são numéricos (e obtém valores indefinidos para os índices ausentes:

function isNumber(n) {
  return !isNaN(parseFloat(n)) && isFinite(n);
}

myObj= {1:[1,2], 2:[3,4]}
var arr =[];
for( var i in myObj ) {
    if (myObj.hasOwnProperty(i)){
        if (isNumber(i)){
            arr[i] = myObj[i];
        }else{
          arr.push(myObj[i]);
        }
    }
}
Nicola Peluchetti
fonte
1
Você deveria ter testado o código. $.mapachatará Array-Data.
Marko Dumic
você está certo, eu não o testei com uma matriz e o mapa a achatou! i modificado a resposta
Nicola Peluchetti
@Nicola Peluchetti $ .makeArray () parece bom, mas não é o que eu estava procurando, porque simplesmente coloca o objeto em um elemento da matriz: [{1:[Array-Data], 2:[Array-Data]}]E $.map()também não parece bem-sucedido. Parece que todos os dados da Sub-matriz são mesclados em uma matriz. array.lengthdeve retornar 2 (porque existem 2 elementos), mas retorna 67, que é o número de todos os elementos em todos ["Array-Data"].
The Bndr
@The BNDR eu postei uma outra solução, mas você pode usar o mapa como sugerido por dogbert
Nicola Peluchetti
Eu acho que você deve especificar explicitamente o índice da matriz ... como arr[+i] = myObj[i];porque (i) for(...in...)não é garantido para propriedades de retorno em qualquer ordem (ii) no exemplo do OP as propriedades começam a partir de 1, não 0.
Salman A
30

Simplesmente faça

Object.values(obj);

Isso é tudo!

Pila
fonte
11
Object.values é um método ES2017 que não é suportado no Safari, IE, Nó 6.
Phil Ricketts
25

Se você souber o índice máximo em seu objeto, poderá fazer o seguinte:

var myObj = {
    1: ['c', 'd'],
    2: ['a', 'b']
  },
  myArr;

myObj.length = 3; //max index + 1
myArr = Array.prototype.slice.apply(myObj);
console.log(myArr); //[undefined, ['c', 'd'], ['a', 'b']]

bjornd
fonte
1
Seria muito melhor para o código que está gerando o objeto também definir o comprimento ou torná-lo uma matriz em primeiro lugar. Eu não espero que seja possível, então essa resposta para mim não é útil.
usar o seguinte comando
myObj.length = Object.keys(myObj).length
Baldrs
19

Como o ES5 Object.keys () retorna uma matriz que contém as propriedades definidas diretamente em um objeto (excluindo propriedades definidas na cadeia de protótipos):

Object.keys(yourObject).map(function(key){ return yourObject[key] });

O ES6 dá um passo adiante com as funções de seta:

Object.keys(yourObject).map(key => yourObject[key]);
Maxdow
fonte
1
Para o ES5 atual (embora eu goste do ES6): Object.keys (yourObject) .map (function (key) {return yourObject [key]});
David Zorychta
18

Atualmente, existe uma maneira simples de fazer isso: Object.values ​​() .

var myObj = {
    1: [1, 2, 3],
    2: [4, 5, 6]
};

console.log(Object.values(myObj));

Resultado:

[[1, 2, 3], [4, 5, 6]]

Isso não requer jQuery, foi definido no ECMAScript 2017.
É suportado por todos os navegadores modernos (esqueça o IE).

Stopi
fonte
se eu fizer algo parecido var state = { ingredient: { salad: 1, bacon: 1, } }e, em seguida, var HariOm = Object.values(state);seguido por console.log(typeof HariOM)ele exibe o tipo como um objeto. Não deveria exibi-lo como uma matriz?
IRohitBhatia 27/05
Isso é completamente normal, verifique a referência aqui: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/... - Você pode usarArray.isArray(HariOM)
Stopi
16

O melhor método seria usar uma função javascript-only:

var myArr = Array.prototype.slice.call(myObj, 0);
Friedrich
fonte
@Qwerty qual navegador?
test30
Cromada. Testado comvar myObj = {1:[1,2,3],2:[4,5,6]};
Qwerty
Observe que esse método funciona para converter "objetos do tipo array", o que significa que eles precisam ter uma propriedade "length" e propriedades enumeradas com valor igual a 0. Portanto, para que o exemplo do @ Qwerty funcione, tente o seguinte: {0: [1 , 2,3], 1: [4,5,6], comprimento: 2}. Experimente com valores de índice e valores de comprimento, é um pouco branda. Aqui está uma boa leitura sobre o tópico: nfriedly.com/techblog/2009/06/… Pule para "Objetos semelhantes a matrizes ".
Matt
15
x = [];
for( var i in myObj ) {
    x[i] = myObj[i];
}
ninguém
fonte
10
Você deve usar empurrão, caso contrário você pode acabar criando um objeto
Nicola Peluchetti
Talvez seja uma força melhor para int o índice. var bbb = {'1': 'a', '3': 'b'}; var x = []; for (var i in bbb) { x[parseInt(i)] = bbb[i];} console.log(x);
tres.14159
15

ECMASCRIPT 5:

Object.keys(myObj).map(function(x) { return myObj[x]; })

ECMASCRIPT 2015 ou ES6:

Object.keys(myObj).map(x => myObj[x])
Aditya Singh
fonte
13

E se jQuery.makeArray(obj)

Foi assim que fiz no meu aplicativo.

Sankalp Singha
fonte
2
Isso retorna [Objeto] para o exemplo acima.
Kris Erickson
1
apenas uma questão de adicionar [0] índice e você salvou a minha vida :)
Raheel
6

A solução é muito simples

var my_obj = {1:[Array-Data], 2:[Array-Data]}
Object.keys(my_obj).map(function(property_name){ 
    return my_obj[property_name]; 
});
Ivan Fretes
fonte
6

ES8 maneira facilitada :

A documentação oficial

    const obj = { x: 'xxx', y: 1 };
    let arr = Object.values(obj); // ['xxx', 1]
    console.log(arr);

Mamba negra
fonte
3

Fiddle Demo

Extensão para resposta de bjornd .

var myObj = {
    1: [1, [2], 3],
    2: [4, 5, [6]]
}, count = 0,
    i;
//count the JavaScript object length supporting IE < 9 also
for (i in myObj) {
    if (myObj.hasOwnProperty(i)) {
        count++;
    }
}
//count = Object.keys(myObj).length;// but not support IE < 9
myObj.length = count + 1; //max index + 1
myArr = Array.prototype.slice.apply(myObj);
console.log(myArr);


Referência

Array.prototype.slice ()

Function.prototype.apply ()

Object.prototype.hasOwnProperty ()

Object.keys ()

Tushar Gupta - curioustushar
fonte
Posso estar errado, mas deveria ser melhor para o myObj ser um enumerável a partir de 0? Senão, parece-me que há um problema em que nossa matriz seria: [indefinida, [1, [2], 3]] (A primeira parte é indefinida porque não encontra myObj ['0'] e a última parte myObj ['2'] sendo ejetada porque, depois de ler .length, ela pára em myObj ['1']? #
Alex Werner
2

Se você deseja manter o nome das propriedades do objeto como valores. Exemplo:

var fields = {
    Name: { type: 'string', maxLength: 50 },
    Age: { type: 'number', minValue: 0 }
}

Use Object.keys(), Array.map()e Object.assign():

var columns = Object.keys( fields ).map( p => Object.assign( fields[p], {field:p} ) )

Resultado:

[ { field: 'Name', type: 'string', maxLength: 50 }, 
  { field: 'Age', type: 'number', minValue: 0 } ]

Explicação:

Object.keys()enumera todas as propriedades da fonte; .map()aplica a =>função a cada propriedade e retorna uma matriz; Object.assign()mescla nome e valor para cada propriedade.

Supersharp
fonte
1

Eu criei uma função personalizada:

    Object.prototype.toArray=function(){
    var arr=new Array();
    for( var i in this ) {
        if (this.hasOwnProperty(i)){
            arr.push(this[i]);
        }
    }
    return arr;
};
mailmindlin
fonte
0

Após alguns testes, aqui está um objeto geral para converter o conversor de funções:

Você tem o objeto:

var obj = {
    some_key_1: "some_value_1"
    some_key_2: "some_value_2"
};

A função:

function ObjectToArray(o)
{
    var k = Object.getOwnPropertyNames(o);
    var v = Object.values(o);

    var c = function(l)
    {
        this.k = [];
        this.v = [];
        this.length = l;
    };

    var r = new c(k.length);

    for (var i = 0; i < k.length; i++)
    {
        r.k[i] = k[i];
        r.v[i] = v[i];
    }

    return r;
}

Uso da função:

var arr = ObjectToArray(obj);

Você obtém:

arr {
    key: [
        "some_key_1",
        "some_key_2"
    ],
    value: [
        "some_value_1",
        "some_value_2"
    ],
    length: 2
}

Assim, você pode alcançar todas as chaves e valores como:

for (var i = 0; i < arr.length; i++)
{
    console.log(arr.key[i] + " = " + arr.value[i]);
}

Resultado no console:

some_key_1 = some_value_1
some_key_2 = some_value_2

Editar:

Ou em forma de protótipo:

Object.prototype.objectToArray = function()
{
    if (
        typeof this != 'object' ||
        typeof this.length != "undefined"
    ) {
        return false;
    }

    var k = Object.getOwnPropertyNames(this);
    var v = Object.values(this);

    var c = function(l)
    {
        this.k = [];
        this.v = [];
        this.length = l;
    };

    var r = new c(k.length);

    for (var i = 0; i < k.length; i++)
    {
        r.k[i] = k[i];
        r.v[i] = v[i];
    }

    return r;
};

E então use como:

console.log(obj.objectToArray);
Kostas
fonte
0

Você pode criar uma função simples para fazer a conversão de objectpara array, algo assim pode fazer o trabalho para você usando javascript puro:

var objectToArray = function(obj) {
  var arr = [];
  if ('object' !== typeof obj || 'undefined' === typeof obj || Array.isArray(obj)) {
    return obj;
  } else {
    Object.keys(obj).map(x=>arr.push(obj[x]));
  }
  return arr;
};

ou este:

var objectToArray = function(obj) {
  var arr =[];
  for(let o in obj) {
    if (obj.hasOwnProperty(o)) {
      arr.push(obj[o]);
    }
  }
  return arr;
};

e chame e use a função como abaixo:

var obj = {1:'a', 2:'b', 3:'c', 4:'d', 5:'e'};
objectToArray(obj); // return ["a", "b", "c", "d", "e"]

Também no futuro, teremos algo chamado Object.values(obj), semelhante ao Object.keys(obj)qual retornará todas as propriedades para você como uma matriz, mas ainda não é suportado em muitos navegadores ...

Alireza
fonte