Bir anahtar => değer dizisini JavaScript'te depolamanın en iyi yolu?

Bir key=>valuediziyi javascript'te saklamanın en iyi yolu nedir ve bu nasıl çevrilebilir?

Her öğenin anahtarı, {id}ya da sadece gibi bir etiket idolmalı ve değer, kimliğin sayısal değeri olmalıdır.

Ya varolan bir javascript sınıfının öğesi olmalı ya da sınıf aracılığıyla kolayca başvurulabilen genel bir değişken olmalıdır.

jQuery kullanılabilir.

Sadece bir JavaScript nesnesi budur:

var myArray = {id1: 100, id2: 200, "tag with spaces": 300};
myArray.id3 = 400;
myArray["id4"] = 500;

Döngüyü kullanarak for..indöngü yapabilirsiniz :

for (var key in myArray) {
  console.log("key " + key + " has value " + myArray[key]);
}

Ayrıca bkz: Nesnelerle çalışma (MDN).

ECMAScript6'da ayrıca vardır Map(oradaki tarayıcı uyumluluk tablosuna bakın):

• Bir Nesnenin bir prototipi vardır, bu nedenle haritada varsayılan anahtarlar vardır. Bu, ES5'ten beri map = Object.create (null) kullanılarak atlanabilir, ancak nadiren yapılır.

• Bir Nesnenin anahtarları, bir Harita için herhangi bir değer olabilecek Dizeler ve Sembollerdir.

• Bir Nesnenin boyutunu manuel olarak takip etmek zorundayken Harita boyutunu kolayca elde edebilirsiniz.

Eğer seni doğru anladıysam:

var hash = {};
hash['bob'] = 123;
hash['joe'] = 456;

var sum = 0;
for (var name in hash) {
    sum += hash[name];
}
alert(sum); // 579

Sen kullanabilirsiniz Harita .

• JavaScript ES6'da tanıtılan yeni bir veri yapısı.
• Anahtar / değer çiftlerini saklamak için JavaScript Nesnesine alternatif.
• Anahtar / değer çiftleri üzerinde yineleme için yararlı yöntemler vardır.

var map = new Map();
map.set('name', 'John');
map.set('id', 11);

// Get the full content of the Map
console.log(map); // Map { 'name' => 'John', 'id' => 11 }

Tuşunu kullanarak Haritanın değerini alın

console.log(map.get('name')); // John 
console.log(map.get('id')); // 11

Haritanın boyutunu alma

console.log(map.size); // 2

Haritada kontrol anahtarı var

console.log(map.has('name')); // true
console.log(map.has('age')); // false

Anahtarları al

console.log(map.keys()); // MapIterator { 'name', 'id' }

Değerleri alın

console.log(map.values()); // MapIterator { 'John', 11 }

Harita öğelerini alın

for (let element of map) {
  console.log(element);
}

// Output:
// [ 'name', 'John' ]
// [ 'id', 11 ]

Anahtar / değer çiftlerini yazdır

for (let [key, value] of map) {
  console.log(key + " - " + value);
}

// Output: 
// name - John
// id - 11

Haritanın yalnızca tuşlarını yazdır

for (let key of map.keys()) {
  console.log(key);
}

// Output:
// name
// id

Yalnızca Haritanın değerlerini yazdır

for (let value of map.values()) {
  console.log(value);
}

// Output:
// John
// 11

Javascript'te bir anahtar / değer dizisi nesne olarak saklanır. Javascript diziler gibi şeyler vardır, ama onlar yine de biraz nesne olarak kabul edilir, bu adamlar cevap kontrol - Neden bir dizi bir nesne gibi adlandırılmış özellikleri ekleyebilirim?

Diziler genellikle köşeli parantez sözdizimi ve nesneler ("key => değer" dizileri) kullanılarak kıvırcık parantez sözdizimi kullanılarak görülür, ancak Alexey Romanov'un gösterdiği gibi köşeli parantez sözdizimini kullanarak nesne özelliklerine erişebilir ve ayarlayabilirsiniz.

Javascript'teki diziler genellikle yalnızca sayısal, otomatik artan anahtarlarla kullanılır, ancak javascript nesneleri adlandırılmış anahtar değeri çiftlerini, işlevleri ve hatta diğer nesneleri de tutabilir.

Basit Dizi örn.

$(document).ready(function(){

    var countries = ['Canada','Us','France','Italy'];
    console.log('I am from '+countries[0]);
    $.each(countries, function(key, value) {
        console.log(key, value);
    });

});

Çıktı -

0 "Kanada"

1 "Biz"

2 "Fransa"

3 "İtalya"

Yukarıda, jQuery.each işlevini kullanarak sayısal bir dizi döngüye sokabildiğimizi ve sayısal anahtarlara sahip köşeli parantezler kullanarak döngü dışında bilgilere erişebileceğimizi görüyoruz.

Basit Nesne (json)

$(document).ready(function(){

    var person = {
        name: "James",
        occupation: "programmer",
        height: {
            feet: 6,
            inches: 1
        },
    }

    console.log("My name is "+person.name+" and I am a "+person.height.feet+" ft "+person.height.inches+" "+person.occupation);

    $.each(person, function(key, value) {
        console.log(key, value);
    });

});

Çıktı -

Benim adım James ve ben 6 ft 1 programcıyım

adı James

meslek programcısı

yükseklik Nesne {feet: 6, inç: 1}

Php gibi bir dilde bu, anahtar değer çiftlerine sahip çok boyutlu bir dizi veya bir dizi içindeki bir dizi olarak kabul edilir. Ben bir anahtar değer dizisi üzerinden döngü hakkında sordum çünkü nasıl bir nesne (key => değer dizisi) yukarıdaki kişi nesnesi gibi, örneğin birden fazla kişi sahip olmak istiyorum bilmek istiyorum.

Javascript dizilerinin tipik olarak sayısal indeksleme için kullanıldığını ve ilişkisel indeksleme için daha esnek nesneler kullandığını bildiğimize göre, bunları bir araya getirerek, bir araya getirebileceğimiz bir dizi nesne oluşturmak için kullanacağız.

JSON dizisi (nesne dizisi) -

$(document).ready(function(){

    var people = [
        {
            name: "James",
            occupation: "programmer",
            height: {
                feet: 6,
                inches: 1
            }
        }, {
            name: "Peter",
            occupation: "designer",
            height: {
                feet: 4,
                inches: 10
            }
        }, {
            name: "Joshua",
            occupation: "CEO",
            height: {
                feet: 5,
                inches: 11
            }
        }
    ];

    console.log("My name is "+people[2].name+" and I am a "+people[2].height.feet+" ft "+people[2].height.inches+" "+people[2].occupation+"\n");

    $.each(people, function(key, person) {
        console.log("My name is "+person.name+" and I am a "+person.height.feet+" ft "+person.height.inches+" "+person.occupation+"\n");
    });

});

Çıktı -

Benim adım Joshua ve ben 5 ft 11 CEO'yum

Benim adım James ve ben 6 ft 1 programcıyım

Benim adım Peter ve ben 4 ft 10 tasarımcıyım

Benim adım Joshua ve ben 5 ft 11 CEO'yum

Döngünün dışında sayısal bir anahtarla köşeli parantez sözdizimini kullanmak zorunda olduğumuzu unutmayın, çünkü bu artık sayısal olarak indekslenmiş bir nesne dizisidir ve elbette döngü içinde sayısal anahtar ima edilir.

Bir dizinin içindeki nesneler:

var cars = [
        { "id": 1, brand: "Ferrari" }
        , { "id": 2, brand: "Lotus" }
        , { "id": 3, brand: "Lamborghini" }
    ];

Sadece bunu yap

var key = "keyOne";
var obj = {};
obj[key] = someValue;

Geç olduğunu biliyorum ama başka yollar isteyenler için yararlı olabilir. Dizi anahtarı => değerlerinin saklanmasının başka bir yolu, map () adlı bir dizi yöntemi kullanmaktır; ( https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map ) ok işlevini de kullanabilirsiniz

 
    var countries = ['Canada','Us','France','Italy'];  

    // Arrow Function  

    countries.map((value, key) => key+ ' : ' + value );  

    // Anonomous Function  

    countries.map(function(value, key){  

         return key + " : " + value;  

    });  

    

Bugün laravel-blade-javascript adlı yeni paketimizi yayınladık. PHP değişkenlerini JavaScript'e aktarmak için bir javascript Blade yönergesi sağlar. Temelde Jeffrey Way'in popüler PHP-Vars-To-Js-Transformer paketiyle aynı şeyi yapıyor, ancak kontrolördeki değişkenleri dışa aktarmak yerine paketimiz bir görünüm yapıyor.

İşte nasıl kullanılabileceğine dair bir örnek:

@javascript('key', 'value')

Oluşturulan görünüm çıktılar:

<script type="text/javascript">window['key'] = 'value';</script>

Böylece tarayıcınızda artık bir anahtar değişkene erişiminiz var:

console.log(key); //outputs "value"

Ayrıca tek bir argüman da kullanabilirsiniz:

@javascript(['key' => 'value'])

Hangi ilk örnek ile aynı çıktı.

Tüm dışa aktarılan JavaScript değişkenlerinin bulunması gereken bir ad alanı ayarlamak için yapılandırma dosyasını da kullanabilirsiniz.