[JavaScript] JSON


JSON(JavaScript Object Notation)


JavaScriptオブジェクトのデータフォーマットを文字列で表します.
JavaScriptオブジェクトの文字列に似ていますが、オブジェクトの文字列ではありません.
再帰関数を使用できるツリー構造
主にWebアプリケーションとサーバ-クライアント間のデータ交換に使用されます.
  • シリアル化(シーケンス化):オブジェクト->JSON変換
  • 逆シーケンス化:JSON->オブジェクト変換
  • シリアル化が必要な理由:参照タイプのデータ値を渡すには、メモリアドレスが指す実際のデータ値を取得し、値タイプに変換する必要があります.
    importの場合は拡張子を入力します.
    import myData from './myData.json'

    JSONルール


    // 자바스크립트 객체
    {
      sender: "김코딩",
      receiver: "박해커",
      message: "해커야 오늘 저녁 같이 먹을래?",
      createdAt: "2021-01-12 10:10:10"
    }
    // JSON
    {
      "sender": "김코딩",
      "receiver": "박해커",
      "message": "해커야 오늘 저녁 같이 먹을래?",
      "createdAt": "2021-01-12 10:10:10"
    }

    JSONメソッド

    JSON.stringify(object):JavaScriptオブジェクトを文字列(シリアル)に変換
    var dog = {name: "식빵", family: "웰시코기", age: 1, weight: 2.14}; // 자바스크립트 객체
    
    var data = JSON.stringify(dog); // 자바스크립트 객체를 문자열로 변환함.
    // "{"name":"식빵","family":"웰시코기","age":1,"weight":2.14}"
    undefinedfunctionnullに変換JSON.parse(string):文字列をJavaScriptオブジェクトに変換(逆シーケンス化)
    var data = '{"name": "식빵", "family": "웰시코기", "age": 1, "weight": 2.14}'; // JSON 형식의 문자열
    
    var dog = JSON.parse(data); // JSON 형식의 문자열을 자바스크립트 객체로 변환함.
    // {name: "식빵", family: "웰시코기", age: 1, weight: 2.14}
    toJSON:JavaScriptのDateオブジェクトのデータをJSON形式の文字列に変換する
    var date = new Date();   // 자바스크립트 Date 객체
    // Sun Jun 13 2021 20:27:50 GMT+0900 (대한민국 표준시)
    var str = date.toJSON(); // Date 객체를 JSON 형식의 문자열로 변환함.
    // "2021-06-13T11:27:50.539Z"
    JSON.stringfy注意点
    循環参照がある場合は、必要に応じてオブジェクトを文字列に置き換えることはできません.
    let a = {};
    let b = {};
    
    a.root = b;	// a는 b를 참조합니다.
    b.root = a;	// b는 a를 참조합니다.
    
    JSON.stringify(a); // Error: Converting circular structure to JSON
    JSON作成時によくあるエラー
    {
      name: "John",                     // 실수 1: 프로퍼티 이름을 큰따옴표로 감싸지 않았습니다.
      "surname": 'Smith',               // 실수 2: 프로퍼티 값은 큰따옴표로 감싸야 하는데, 작은따옴표로 감쌌습니다.
      'isAdmin': false                  // 실수 3: 프로퍼티 키는 큰따옴표로 감싸야 하는데, 작은따옴표로 감쌌습니다.
      "birthday": new Date(2000, 2, 3), // 실수 4: "new"를 사용할 수 없습니다. 순수한 값(bare value)만 사용할 수 있습니다.
      "friends": [0,1,2,3]              // 이 프로퍼티는 괜찮습니다.
    }`;
    リストアの使用
    次に、サーバから受信したjsonタイプのデータが逆シーケンス化中に発生する問題を示します.
    let str = '{"title":"Conference","date":"2017-11-30T12:00:00.000Z"}';
    let meetup = JSON.parse(str);
    alert( meetup.date.getDate() ); // 에러!
    理由はmeetupdataの値はDateオブジェクトではなく文字列なので.したがって、文字列をDateに変換する必要があります.復元器が使用されます.
    let meetup = JSON.parse(str, function(key, value) {
      if (key == 'date') return new Date(value);
      return value;
    });
    TCP SCHOOL
    シリアル化とは