JS nesnesini jQuery kullanarak bir diziye dönüştürme


417

Uygulamam aşağıdaki gibi bir JavaScript nesnesi oluşturur:

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

Ama bir dizi olarak bu nesneye ihtiyacım var.

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

Böylece nesne ile yineleme $.eachve bir diziye öğe ekleyerek bu nesneyi bir diziye dönüştürmek için çalıştı :

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

Bir nesneyi bir diziye veya belki bir işleve dönüştürmenin daha iyi bir yolu var mı?


1
Dizi indeksleri orijinal nesnedeki anahtarlarla aynı mı olmalı? Bir dizideki ilk dizin her zaman 0'dır, ancak kendi kodunuz ve çoğu yanıt (kabul edilen de dahil) onu yok sayıyor gibi görünüyor; yine de düzenlememi istenen örnek sonuca geri döndürdünüz.
Imre

1
0. ilk Dizi elemanı başlar Ama mümkün olduğunca bu örnek basit tutmak için gözlerimi tutarlı değildi çünkü değişen çünkü, Düzenlemenizi döndürüldü: Evet, haklısınız myObj= {1:[Array-Data]için myObj= {0:[Array-Data](doğru hatırlıyorsam gibi) Düzenlemenizin parçası değildi
The Bndr

3
Bu api.jquery.com/jQuery.makeArray için jQuery $ .makeArray (obj) komutunu kullanın
DevlshOne

@DevlshOne belgelendirme u diyor ki: "Bir jQuery nesnesini bir diziye dönüştür" Bu OP sorusuna uymuyor sanmıyorum
Alex

Yanıtlar:


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

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


console.log(array);

Çıktı:

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

8
@Dobert, lütfen açıklayabilir misiniz $.map? Bu konuda yapmaya çalıştığım her arama jQuery veya dizilerin harita yöntemi için çok sayıda bağlantı ortaya çıkıyor.
crantok

21
D'oh! Yorumumu yoksay. Bu sorudaki jQuery etiketini fark etmemiştim.
crantok

8
Yeni dizideki anahtarları korumanın bir yolu var mı? www i her cevap anahtarları dönüşüm yok.
TD_Nijboer

55
Bunu jQuery olmadan da yapabilirsiniz: Object.keys (myObject) .map (function (val) {return [val]});
Kris Erickson

3
@TD_Nijboer Evet, value.key = index; return [value];yerine kullanınreturn [value];
Simon Arnold

742

İşlevsel bir yaklaşım arıyorsanız:

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

Sonuçlar:

[11, 22]

ES6 ok işlevi ile aynı:

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

ES7 ile Object.valuesbunun yerine kullanabileceksiniz ( daha fazla bilgi ):

var arr = Object.values(obj);

Veya zaten Alt Çizgi / Lo-Dash kullanıyorsanız:

var arr = _.values(obj)


3
Üst cevaptan memnun kalmadan, bu neredeyse tam işlevi yazdım, cevap olarak geri döndüm, aşağı kaydırdım, 170 gördüm. üstte olmalıdır. OP pls cevap olarak seçin.
j03m

1
bunun açık olmadığı herkes için, tuşların sıralı olması gerekmez (yani bu örnekte 1 ve 2'dir - ancak bir dize anahtarı veya sıralı olmayan bir sayı da olabilirler
Simon_Weaver

Kodun ilk paragrafı için noktalı virgül eksik. Emin değilim neden.
JohnnyBizzle

@JohnnyBizzle Sanırım linteriniz "return obj [key];" sonunda noktalı virgül ile. JavaScript bunu yapmaz.
Joel Richard

30

Kullanabileceğinizi düşünüyorum for inama mülkiyet atalet olmadığını kontrol

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

DÜZENLEME - isterseniz nesnenizin dizinlerini de saklayabilirsiniz, ancak sayısal olup olmadıklarını kontrol etmeniz gerekir (ve eksik dizinler için tanımlanmamış değerler elde edersiniz:

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]);
        }
    }
}

1
Kodu test etmiş olmalısınız. $.mapdüzleşecek Array-Data.
Marko Dumic

haklısın ben bir dizi ile test etmedi ve harita flattens! Cevabı değiştirdim
Nicola Peluchetti

@Nicola Peluchetti $ .makeArray () iyi görünüyor, ancak aradığım şey değil, çünkü nesneyi bir dizi öğesine koyar: [{1:[Array-Data], 2:[Array-Data]}]Ve $.map()aynı zamanda başarılı görünmüyor. Tüm Alt Dizi verilerinin bir diziyle birleştirildiğini ekler. array.length2 döndürmelidir (2 öğe olduğu için), ancak tüm ["Array-Data"] öğesindeki tüm öğelerin sayısı olan 67 değerini döndürür.
The Bndr

@ The Bndr başka bir çözüm gönderdi, ancak haritayı dogbert tarafından önerildiği gibi kullanabilirsiniz
Nicola Peluchetti

Ben açıkça dizi dizini belirtmek gerektiğini düşünüyorum ... gibi arr[+i] = myObj[i];(i) for(...in...)herhangi bir sırayla özellikleri döndürmek için garanti edilmez (ii) OP örnekte özellikleri özellikleri 0 değil, 1 başlar.
Salman A

30

Basitçe yapın

Object.values(obj);

Bu kadar!


11
Object.values, Safari, IE, Node 6'da desteklenmeyen bir ES2017 yöntemidir.
Phil Ricketts

25

Nesnenizdeki maksimum dizini biliyorsanız aşağıdakileri yapabilirsiniz:

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']]


1
Nesneyi oluşturan kodun uzunluğu da ayarlaması veya aslında onu bir dizi haline getirmesi çok daha iyi olur. İkisinin de mümkün olduğunu sanmıyorum, bu yüzden bu cevap benim için yararlı değil.
user2000095-tim

myObj.length = Object.keys(myObj).length
baldrs

19

ES5 Object.keys () yöntemi, doğrudan bir nesne üzerinde tanımlanan özellikleri içeren bir dizi döndürdüğünden (prototip zincirinde tanımlanan özellikler hariç):

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

ES6, ok işlevleriyle bir adım ileri gider:

Object.keys(yourObject).map(key => yourObject[key]);

1
Geçerli ES5 için (ES6'nın keyfini çıkarmamıza rağmen): Object.keys (yourObject) .map (function (key) {return yourObject [key]});
David Zorychta

18

Günümüzde bunu yapmanın basit bir yolu var: Object.values ​​() .

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

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

Çıktı:

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

Bu jQuery gerektirmez, ECMAScript 2017'de tanımlanmıştır.
Her modern tarayıcı tarafından desteklenir (IE'yi unutun).


i gibi bir şey yapmak var state = { ingredient: { salad: 1, bacon: 1, } }ve daha sonra var HariOm = Object.values(state);bunu console.log(typeof HariOM)bir nesne olarak türü görüntüler. Bir dizi olarak göstermemeli mi?
iRohitBhatia

Bu tamamen normal, referansı buradan kontrol edin: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/… - KullanabilirsinizArray.isArray(HariOM)
Stopi

16

En iyi yöntem bir javascript -only işlevi kullanmak olacaktır:

var myArr = Array.prototype.slice.call(myObj, 0);

@ Tarayıcı hangi tarayıcıda?
test30

Krom. İle test edildivar myObj = {1:[1,2,3],2:[4,5,6]};
Qwerty

Bu yöntemin "dizi benzeri nesneleri" dönüştürmek için çalıştığını, yani "uzunluk" özelliğine ve sayma özelliklerinin 0'dan sayılması gerektiğine dikkat edin. Bu nedenle, @ Qwerty'nin örneğinin çalışmasını sağlamak için şunu deneyin: {0: [1 , 2,3], 1: [4,5,6], uzunluk: 2}. Dizin değerleri ve uzunluk değerleri ile denemeler yapın, biraz yumuşaktır. İşte konuyla ilgili iyi bir okuma: nfriedly.com/techblog/2009/06/… "Dizi benzeri Nesneler" e geçin.
Matt

15
x = [];
for( var i in myObj ) {
    x[i] = myObj[i];
}

10
Push'u

Belki endekste int yapmak daha iyi bir güçtür. 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 veya ES6:

Object.keys(myObj).map(x => myObj[x])

13

Peki ya jQuery.makeArray(obj)

Uygulamamda böyle yaptım.


2
Bu, yukarıdaki örnek için [Nesne] döndürür.
Kris Erickson

1
[0] endeksi ekleme meselesi ve hayatımı kurtardın :)
Raheel

6

Çözmek çok basit

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


3

Fiddle Demo

Bjornd cevabının uzantısı .

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);


Referans

Array.prototype.slice ()

Function.prototype.apply ()

Object.prototype.hasOwnProperty ()

Object.keys ()


Yanılıyor olabilirim, ancak myObj 0'dan başlayarak numaralandırılabilir olmak daha iyi olmalı mı? Yoksa bana öyle geliyor ki Dizimizin olacağı bir sorun var: [undefined, [1, [2], 3]] (İlk kısım tanımsız çünkü myObj'i bulamıyor ['0'] ve son bölüm myObj ['2'] çıkarıldı çünkü .length okuduktan sonra myObj ['1'] 'de duruyor?
Alex Werner

2

Nesnenin özelliklerinin adını değer olarak tutmak istiyorsanız. Misal:

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

Kullanın Object.keys(), Array.map()ve Object.assign():

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

Sonuç:

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

Açıklama:

Object.keys()kaynağın tüm özelliklerini sıralar; işlevi her özelliğe .map()uygular =>ve bir Array döndürür; Object.assign()her özellik için ad ve değeri birleştirir.


1

Özel bir işlev yaptım:

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

0

Bazı testlerden sonra, genel bir nesneden diziye işlev dönüştürücü:

Nesneniz var:

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

İşlev:

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;
}

İşlev Kullanımı:

var arr = ObjectToArray(obj);

Şunları elde edersiniz:

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

Böylece aşağıdaki gibi tüm anahtarlara ve değerlere ulaşabilirsiniz:

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

Sonuç konsolda:

some_key_1 = some_value_1
some_key_2 = some_value_2

Düzenle:

Veya prototip biçiminde:

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;
};

Ve sonra şöyle kullanın:

console.log(obj.objectToArray);

0

Sen den dönüştürme yapmak için basit bir fonksiyon oluşturabilir objectiçin array, böyle bir şey Saf javascript kullanarak için iş yapabilirsiniz:

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;
};

ya da bu:

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

ve fonksiyonu aşağıdaki gibi arayın ve kullanın:

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

Ayrıca gelecekte Object.values(obj), Object.keys(obj)sizin için tüm özellikleri bir dizi olarak döndürecek, ancak henüz birçok tarayıcıda desteklenmeyen benzer bir şeyimiz olacak ...

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.