Get best of the week

5 wenig bekannte Funktionen von JSON.stringify ()



Guten Tag, Freunde!

In diesem kurzen Artikel möchte ich Ihnen einige der selten verwendeten Funktionen von JSON.stringify () erläutern. Sie können für Sie nützlich sein.

JSON.stringify () wird häufig beim Debuggen verwendet, um ein Objekt oder eine reguläre Zeichenfolge in eine Zeichenfolge im JSON-Format zu konvertieren. Aber wie wird diese Methode verwendet und können wir toString () umgehen? Lass es uns versuchen.

//   user
const user = {
    name: 'Harry Heman',
    age: 29,
    job: 'developer'
}

//    ,    toString(),     
console.log(user.toString()) // [object Object]

[Objekt Objekt] ist nicht genau das, was wir sehen wollten, oder?

Fragen Sie nicht, warum wir toString () überhaupt verwenden. Angenommen, wir müssen ein Objekt in eine Zeichenfolge übersetzen.

Versuchen Sie nun, JSON.stringify () zu verwenden:

console.log(JSON.stringify(user)) // {"name":"Harry Heman","age":29, "job": "developer"}

Wir haben es geschafft, Carl!

Die Möglichkeiten von JSON.stringify () sind jedoch nicht darauf beschränkt.

1. Verwenden eines Arrays als zweites Argument


Sie haben richtig gehört, die Stringify-Funktion hat möglicherweise ein zweites Argument. Dieses Argument ist das Schlüsselarray des Objekts, das in der Konsole angezeigt werden soll. Nehmen wir an, wir haben eine solche Reihe von Objekten:

let users = [
    {
        id: 1,
        login: 'harry',
        password: 'qwerty',
        status: 'admin',
        access: true
    },
    {
        id: 2,
        login: 'alice',
        password: 'qwerty',
        status: 'user'
    },
    {
        id: 3,
        login: 'bob',
        password: 'qwerty',
        status: 'user'
    },
    {
        id: 4,
        login: 'john',
        password: 'qwerty',
        status: 'user'
    },
    {
        id: 5,
        login: 'jane',
        password: 'qwerty',
        status: 'user'
    }
]

... und wir möchten sehen, welcher der Benutzer der Administrator ist (der Administrator hat die Eigenschaft "access").

Wenn wir console.log (JSON.stringify (Benutzer)) verwenden, erhalten wir Folgendes:

[{"id":1,"login":"harry","password":"qwerty","status":"admin", "access": true},{"id":2,"login":"alice","password":"qwerty","status":"user"},{"id":3,"login":"bob","password":"qwerty","status":"user"},{"id":4,"login":"john","password":"qwerty","status":"user"},{"id":5,"login":"jane","password":"qwerty","status":"user"}]

Stimmen Sie zu, nicht sehr lesbar.

Versuchen Sie nun Folgendes:

console.log(JSON.stringify(users, ['id', 'access'])) // [{"id":1,"access":true},{"id":2},{"id":3},{"id":4},{"id":5}]

So viel besser.

Fairerweise sollte beachtet werden, dass wir in diesem Fall console.table (Benutzer) verwenden könnten:



... aber wir sprechen über JSON.stringify (), damit wir nicht abgelenkt werden. Das Beispiel ist nicht sehr gut, aber ich denke, die Idee ist klar.

2. Verwenden einer Funktion als zweites Argument


Die Funktion wertet jedes Schlüssel-Wert-Paar als zweites Argument aus, das gemäß der Logik dieser Funktion zu stringifizieren ist. Wenn wir undefiniert zurückgeben, wird das entsprechende Schlüssel-Wert-Paar nicht angezeigt. Beispiel:

const result = JSON.stringify(users, (key, value) => {
    if (typeof value === 'string') return undefined

    return value
})

console.log(result) // [{"id":1,"access":true},{"id":2},{"id":3},{"id":4},{"id":5}]

3. Verwenden Sie eine Zahl als dritten Parameter


Das dritte Argument ist für Leerzeichen verantwortlich. Wenn dieses Argument eine Zahl ist, hat jede Zeilenebene einen entsprechenden Einzug:

console.log(JSON.stringify(user, null, 2))

Wir bekommen folgendes:

{
  "name": "Harry Heman",
  "age": 29,
  "job": "developer"
}

4. Verwenden einer Zeichenfolge als drittes Argument


Wenn der dritte Parameter eine Zeichenfolge ist, werden die Zeichen dieser Zeichenfolge anstelle von Leerzeichen verwendet:

console.log(JSON.stringify(user, null, '->'))

Wir bekommen folgendes:

{
->"name": "Harry Heman",
->"age": 29,
->"job": "developer"
}

5. toJSON-Methode


Die toJSON-Methode kann eine Eigenschaft eines beliebigen Objekts sein. JSON.stringify () gibt das Ergebnis dieser Funktion zurück, ohne das gesamte Objekt zu konvertieren:

const user = {
    first: 'Harry',
    last: 'Heman',
    age: 29,
    toJSON(){
        return {
            full: `${this.first} ${this.last}`
        }
    }
}

console.log(JSON.stringify(user)) // "full": "Harry Heman"

Bonus


Neben JSON.stringify () und toJSON () gibt es auch eine json () -Methode, die ein Versprechen (Versprechen) zurückgibt. Diese Methode wird in Serveranforderungen verwendet.

Anwendungsbeispiel:

const url = 'https://jsonplaceholder.typicode.com/users'

asyncAwaitFetch()
async function asyncAwaitFetch(){
    try {
        const response = await fetch(url)
        const data = await response.json()
        console.table(data)
    } catch (error){
        console.error(error)
    } finally {
        console.log('')
    }
}

Wir bekommen folgendes:



Vielen Dank für Ihre Aufmerksamkeit.

Viel Spaß beim Codieren!

More articles:


All Articles