Javascript nesnesi vs JSON


208

Javascript nesnesi ve JSON dizesi arasındaki temel farklılıkları açıkça anlamak istiyorum.

Aşağıdaki JS değişkenini oluşturduğumu varsayalım:

var testObject = {one: 1,"two":2,"three":3};

S1. Anahtar / özellik adı hem tırnaklı / tırnaksız olarak geçerli mi? (ör. "one" : 1)

Evetse, fark nedir?

S2: Yukarıdaki nesneyi kullanarak dönüştürürsem JSON.stringify(testObject), özgün JS nesnesi ile JSON arasındaki fark nedir?

Neredeyse aynı olduklarını hissediyorum. Lütfen bu konuyu ayrıntılarıyla açıklayın.

S3: Bir JSON dizesini ayrıştırmak için aşağıdaki yöntem önerilir?

var javascriptObj = JSON.parse(jSonString);

Yanıtlar:


239
  1. Anahtar / özellik adı hem tırnaklı / tırnaksız olarak geçerli mi?

    Anahtar özel karakter (terimi içeren nesne Değişmez notasyonu kullanırken tırnak bir anahtar içine gereken tek zamandır if, :, -vs). JSON'daki bir anahtarın çift tırnak içine alınması gerektiğini belirtmek gerekir .

  2. Yukarıdaki nesneyi kullanarak JSON dönüştürmek, var jSonString = JSON.stringify(testObject);2 (JS obj ve JSON) arasındaki fark nedir?

    JSON bir veri değişim formatıdır. Sıralı listelerin ve sırasız haritaların, dize booleanlarının ve sayılarının bir dizede nasıl temsil edileceğini açıklayan bir standarttır. XML ve YAML gibi diller arasında yapılandırılmış bilgi aktarmanın bir yolu olduğu gibi JSON da aynıdır. Öte yandan bir JavaScript nesnesi fiziksel bir türdür. Tıpkı bir PHP dizisi, bir C ++ sınıfı / yapısı gibi, bir JavaScript nesnesi de JavaScript'in dahili bir türüdür.

    İşte bir hikaye. Bir mağazadan biraz mobilya satın aldığınızı ve teslim edilmesini istediğinizi düşünelim. Ancak stokta kalan tek şey ekran modelidir, ancak satın almayı kabul edersiniz.

    Dükkanda, satın aldığınız çekmeceli dolap yaşayan bir nesnedir:

    var chestOfDrawers = {
        color: "red",
        numberOfDrawers: 4
    }

    Ancak, yazıya bir çekmece gönderemezsiniz, bu yüzden onu sökersiniz (okuyun, dizeleyin). Artık mobilya açısından faydasız. Şimdi JSON. Düz paket formunda.

    {"color":"red","numberOfDrawers":4}

    Aldığınızda, çekmeceli sandığı yeniden inşa edersiniz (okuyun, ayrıştırın). Şimdi bir nesne biçiminde geri döndü.

    JSON / XML ve YAML'ın arkasındaki neden, verilerin programlama dilleri arasında her iki katılımcı dilin anlayabileceği bir biçimde aktarılmasını sağlamaktır; PHP veya C ++ 'a JavaScript nesnenize doğrudan veremezsiniz; çünkü her dil, kaputun altında farklı bir nesneyi temsil eder. Ancak, nesneyi JSON notasyonuna dizdiğimiz için; yani verileri temsil etmenin standart bir yolu , nesnenin JSON temsilini başka bir dil (C ++, PHP) iletebilir, nesnenin JSON temsilini temel alarak sahip olduğumuz JavaScript nesnesini kendi nesnesine yeniden oluşturabilirler .

    JSON'un işlevleri veya tarihleri ​​temsil edemeyeceğini belirtmek önemlidir. Bir nesneyi işlev üyesi ile dizgi yapmaya çalışırsanız, işlev JSON temsilinden çıkarılır. Tarih bir dizgiye dönüştürülecektir;

    JSON.stringify({
        foo: new Date(),
        blah: function () { 
            alert('hello');
        }
    }); // returns the string "{"foo":"2011-11-28T10:21:33.939Z"}"
  3. JSON dizesini ayrıştırmak için aşağıdaki yöntem önerilir mi? var javascriptObj = JSON.parse(jSonString);

    Evet, ancak eski tarayıcılar yerel olarak JSON'u desteklemez (IE <8) . Bunları desteklemek için eklemeniz gerekir json2.js.

    JQuery kullanıyorsanız, desteklenirse başlık altında jQuery.parseJSON()kullanılacak JSON.parse()ve girişi ayrıştırmak için özel bir uygulamaya geri dönecek şekilde arayabilirsiniz .


4
@testndtv mesele bu değil - kağıt üzerinde (veya ekranda) bir JSON dize ve her ne kadar ekran olabilecek bir JS nesnesinin bakmak aynı, aynı şey değiller. JSON, bir nesneyi bir dizeye paketlemenin bir yoludur, bu nedenle bir yere aktarılabilir ve daha sonra bir nesneye geri paketlenebilir.
Alnitak

1
@Matt zayıf analoji IMHO - JSON, yalnızca saf veri nesneleri için yöntem içeren bir nesneyi serileştirmek için kullanılmamalıdır.
Alnitak

1
Yani bir JS nesnesi yöntemleri varsa, bir JSON dizesine dönüştürme tamamen görmezden gelecektir ... yukarıdaki durumda olduğu gibi getIn ve getOut tamamen yok sayılır .... Bu nasıl çalışır?
testndtv

3
@Growler: "şey" sunucuda oluşturulması gerekiyorsa genellikle JSON kullanın ve "şey" olduğu gibi sunuluyorsa bir js dosyası kullanın . Diğer büyük farklılaştırıcı, JSON bunları temsil edemediği için işlevleri ve / veya tarihleri ​​eklemeniz gerekip gerekmediğidir, bu nedenle bir JS dosyasına hizmet vermeniz gerekir. Hala emin değilseniz, Yığın Taşması ile ilgili ayrı bir soru olarak sormaktan çekinmeyin (iletişim kutunuzu temsil etmek için sağlamanız gereken içeriğe bir örnek gösterin) ve bana bağlantıyı söyleyin; Daha yakından bakacağım için mutlu olacağım!
Mat

4
@Matt Siz bayım, af # king dehasınız! Açıklamanız net, anlaşılır, kısa ve anlaşılması kolaydır. Keşke JavaScript / programlama mentorum olsaydınız.
FrankDraws

30

S1: Javascript içinde nesne değişmezleri tanımlarken, anahtarlar tırnak işaretleri içerebilir veya içermeyebilir. Tırnakların, çıplak denediğinizde yorumlayıcının ayrıştırmamasına neden olacak belirli anahtarları belirtmenize izin vermesi dışında bir fark yoktur. Örneğin, yalnızca bir ünlem işareti olan bir anahtar istiyorsanız, tırnak işaretlerine ihtiyacınız olacaktır:

a = { "!": 1234 } // Valid
a = { !: 1234 } //  Syntax error

Yine de çoğu durumda, nesne değişmezleri üzerindeki anahtarların etrafındaki tırnak işaretlerini atlayabilirsiniz.

S2: JSON tam anlamıyla bir dize temsilidir. Sadece bir ip. Bu yüzden şunu düşünün:

var testObject = { hello: "world" }
var jSonString = JSON.stringify(testObject);

Yana testObjectgerçek bir nesnedir, size nesnelerle yapabilirsiniz Üzerinde özelliklerini arayıp başka bir şey yapabilirsiniz:

testObject.hello => "world"

Diğer yandan, jsonString sadece bir dize:

jsonString.hello => undefined

Bir başka farka dikkat edin: JSON'da tüm anahtarlar tırnak içine alınmalıdır. Bu, nesne Q1'deki açıklamam gereğince tırnak işaretlerinin atlanabileceği nesne değişmezleriyle tezat oluşturur.

Q3. Kullanarak bir JSON dizesini ayrıştırabilirsiniz JSON.parseve bu genellikle bunu yapmanın en iyi yoludur (tarayıcı veya bir çerçeve sağlarsa). evalJSON geçerli bir javascript kodu olduğu için de kullanabilirsiniz , ancak eski yöntem bir dizi nedenden dolayı önerilir (eval, bununla ilişkili çok fazla kötü sorun yaşar).


9

JSON tarafından çözülen sorunlar

Diyelim ki iki bilgisayar arasında normal JavaScript nesneleri değiştirmek istiyorsunuz ve iki kural ayarlıyorsunuz:

  • Aktarılan veriler normal bir dize olmalıdır.
  • Yalnızca öznitelikler değiştirilebilir, yöntemler iletilmez.

Şimdi ilk ana bilgisayarda iki nesne oluşturuyorsunuz:

var obj1 = { one: 1,"two":2,"three":3 }; // your example
var obj2 = { one: obj1.one, two: 2, three: obj1.one + obj1.two };

Bu nesneleri ikinci ana bilgisayara iletilmek üzere dizelere nasıl dönüştürebilirsiniz?

  • İlk nesne için, elde edilen bu dizgiyi değişmez tanımdan gönderebilirsiniz '{ one: 1,"two":2,"three":3 }', ancak aslında değişmezi belgenin kod bölümünde okuyamazsınız (en azından kolay değil). Yani obj1ve obj2aslında aynı şekilde işlenmelidir.
  • Tüm nitelikleri ve değerlerini numaralandırmanız ve nesne değişmezine benzer bir dize oluşturmanız gerekir.

JSON, tartışılan ihtiyaçlara bir çözüm olarak oluşturulmuştur: Tüm öznitelikleri ve değerleri listeleyerek bir nesneye eşdeğer bir dize oluşturmak için bir dizi kuraldır (yöntemler yok sayılır).

JSON, öznitelik adları ve değerleri için çift tırnak kullanımını normalleştirir.

JSON'un yalnızca bir dizi kural olduğunu unutmayın (standart).

Kaç adet JSON nesnesi oluşturulur?

Sadece bir tanesi, otomatik olarak JS motoru tarafından oluşturulur.

Tarayıcılarda bulunan modern JavaScript motorlarının JSON adında yerel bir nesnesi vardır. Bu JSON nesnesi şunları yapabilir:

  • JSON.parse (string) kullanarak JSON standardı kullanılarak oluşturulan bir dizginin kodunu çözün. Sonuç, JSON dizesinde bulunan özniteliklere ve değerlere sahip normal bir JS nesnesidir.

  • Normal bir JS nesnesinin niteliklerini / değerlerini JSON.stringify () kullanarak kodlayın. Sonuç, JSON kurallar kümesiyle uyumlu bir dizedir.

(Single) JSON nesnesi bir codec bileşenine benzer, işlevi kodlamak ve kodunu çözmek.

Bunu not et:

  • JSON.parse () bir JSON nesnesi oluşturmaz, normal bir JS nesnesi oluşturur, nesne değişmezi kullanılarak oluşturulan bir nesne ile JSON uyumlu bir dizeden JSON.parse () tarafından oluşturulan bir nesne arasında fark yoktur.

  • Tüm dönüşümler için kullanılan yalnızca bir JSON nesnesi vardır.

Sorulara dönersek :

  • S1: Nesne değişmezleri için tekli çift tırnak kullanımına izin verilir. Tırnak işaretlerinin isteğe bağlı olarak öznitelik adları için kullanıldığını ve dize değerleri için zorunlu olduğunu unutmayın. Nesne değişmezinin kendisi tırnak işaretleri ile çevrelenmez.

  • S2: Değişmez değerlerden oluşturulan ve JSON.parse () kullanılarak oluşturulan nesneler kesinlikle aynıdır. Bu iki nesne oluşturulduktan sonra eşdeğerdir:

    var obj1 = { one: 1, "two": 2, "three": 3 };
    var obj2 = JSON.parse('{ "one": "1", "two": "2", "three": "3" }');

  • S3: Modern tarayıcılarda JSON.parse()JSON uyumlu bir dizeden bir JS nesnesi oluşturmak için kullanılır. (jQuery ayrıca tüm tarayıcılar için kullanılabilecek eşdeğer bir yönteme sahiptir).


7

S1 - JS'de, yalnızca anahtar ayrılmış bir sözcükse veya başka bir deyişle geçersiz bir belirteçse tırnak işaretleri kullanmanız gerekir. JSON'da, anahtar adlarında her zaman çift tırnak kullanmanız GEREKİR.

S2 - jsonStringa, seri girdi nesnenin versiyonu ...

Q3 - aynı görünümlü bir nesneye serileştirilmiş olabilirJSON.parse()


1

Sorunun zaten iyi yanıtları var, aşağıya küçük bir örnek ekliyorum, bu da önceki yanıtlarda verilen açıklamaları anlamayı daha kolay hale getirecek. Daha iyi anlaşılması için snippet'in altındaki yapıştırmayı IDE'nize kopyalayın ve invalid_javascript_object_no_quotesderleme zamanı hatasını önlemek için nesne bildirimi içeren satırı yorumlayın.

// Valid JSON strings(Observe quotes)
valid_json = '{"key":"value"}'
valid_json_2 = '{"key 1":"value 1"}' // Observe the space(special character) in key - still valid


//Valid Javascript object
valid_javascript_object_no_quotes = {
    key: "value"  //No special character in key, hence it is valid without quotes for key
}


//Valid Javascript object
valid_javascript_object_quotes = {
    key:"value",  //No special character in key, hence it is valid without quotes for key
    "key 1": "value 1" // Space (special character) present in key, therefore key must be contained in double quotes  - Valid
}



console.log(typeof valid_json) // string
console.log(typeof valid_javascript_object_no_quotes) // object
console.log(typeof valid_javascript_object_quotes) // object

//Invalid Javascript object 
invalid_javascript_object_no_quotes = {
   key 1: "value"//Space (special character) present in key, since key is not enclosed with double quotes "Invalid Javascript Object"
}
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.