JSON.stringify () рдХреА 5 рдЕрд▓реНрдк-рдЬреНрдЮрд╛рдд рд╡рд┐рд╢реЗрд╖рддрд╛рдПрдВ



рд╢реБрдн рджрд┐рди, рджреЛрд╕реНрддреЛрдВ!

рдЗрд╕ рдЫреЛрдЯреЗ рд╕реЗ рд▓реЗрдЦ рдореЗрдВ, рдореИрдВ рдЖрдкрдХреЛ JSON.stringify () рдХреА рд╢рд╛рдпрдж рд╣реА рдХрднреА рдЗрд╕реНрддреЗрдорд╛рд▓ рдХреА рдЬрд╛рдиреЗ рд╡рд╛рд▓реА рд╡рд┐рд╢реЗрд╖рддрд╛рдУрдВ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдмрддрд╛рдирд╛ рдЪрд╛рд╣рддрд╛ рд╣реВрдВред рд╡реЗ рдЖрдкрдХреЗ рд▓рд┐рдП рдЙрдкрдпреЛрдЧреА рд╣реЛ рд╕рдХрддреЗ рд╣реИрдВред

JSON.stringify () рдЕрдХреНрд╕рд░ JSON рдкреНрд░рд╛рд░реВрдк рдореЗрдВ рдХрд┐рд╕реА рдСрдмреНрдЬреЗрдХреНрдЯ рдпрд╛ рдирд┐рдпрдорд┐рдд рд╕реНрдЯреНрд░рд┐рдВрдЧ рдХреЛ рд╕реНрдЯреНрд░рд┐рдВрдЧ рдореЗрдВ рдмрджрд▓рдиреЗ рдХреЗ рд▓рд┐рдП рдбрд┐рдмрдЧрд┐рдВрдЧ рдХреЗ рджреМрд░рд╛рди рдЙрдкрдпреЛрдЧ рдХрд┐рдпрд╛ рдЬрд╛рддрд╛ рд╣реИред рд▓реЗрдХрд┐рди рдЗрд╕ рдкрджреНрдзрддрд┐ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХреИрд╕реЗ рдХрд┐рдпрд╛ рдЬрд╛рддрд╛ рд╣реИ, рдФрд░ рдХреНрдпрд╛ рд╣рдо рд╕реНрдЯреНрд░рд╛рд╕рд┐рдВрдЧ () рдХреЗ рдЖрд╕рдкрд╛рд╕ рдкреНрд░рд╛рдкреНрдд рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ? рдЪрд▓реЛ рдЗрд╕реЗ рдХрд░рдиреЗ рдХреА рдХреЛрд╢рд┐рд╢ рдХрд░рддреЗ рд╣реИрдВред

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

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

[рдСрдмреНрдЬреЗрдХреНрдЯ рдСрдмреНрдЬреЗрдХреНрдЯ] рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рд╡рд╣ рдирд╣реАрдВ рд╣реИ рдЬреЛ рд╣рдо рджреЗрдЦрдирд╛ рдЪрд╛рд╣рддреЗ рдереЗ, рдХреНрдпрд╛ рдпрд╣ рд╣реИ?

рдпрд╣ рдордд рдкреВрдЫрд┐рдП рдХрд┐ рд╣рдо рд╕реНрдЯреНрд░реИрд╕рд┐рдВрдЧ () рдХрд╛ рдЙрдкрдпреЛрдЧ рдХреНрдпреЛрдВ рдХрд░рддреЗ рд╣реИрдВред рдорд╛рди рд▓реЗрдВ рдХрд┐ рд╣рдореЗрдВ рдХрд┐рд╕реА рд╡рд╕реНрддреБ рдХреЛ рд╕реНрдЯреНрд░рд┐рдВрдЧ рдореЗрдВ рдЕрдиреБрд╡рд╛рдж рдХрд░рдиреЗ рдХреА рдЖрд╡рд╢реНрдпрдХрддрд╛ рд╣реИред

рдЕрдм JSON.stringify () рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рджреЗрдЦреЗрдВ:

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

рд╣рдордиреЗ рдпрд╣ рдХрд┐рдпрд╛, рдХрд╛рд░реНрд▓!

рд╣рд╛рд▓рд╛рдБрдХрд┐, JSON.stringify () рдХреА рд╕рдВрднрд╛рд╡рдирд╛рдПрдБ рдЗрд╕ рддрдХ рд╕реАрдорд┐рдд рдирд╣реАрдВ рд╣реИрдВред

1. рджреВрд╕рд░реЗ рддрд░реНрдХ рдХреЗ рд░реВрдк рдореЗрдВ рдПрдХ рд╕рд░рдгреА рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛


рдЖрдкрдиреЗ рд╕рд╣реА рд╕реБрдирд╛, рд╕реНрдЯреНрд░рд┐рдВрдЧ рдлрд╝рдВрдХреНрд╢рди рдореЗрдВ рдПрдХ рджреВрд╕рд░рд╛ рддрд░реНрдХ рд╣реЛ рд╕рдХрддрд╛ рд╣реИред рдпрд╣ рддрд░реНрдХ рдЙрд╕ рдСрдмреНрдЬреЗрдХреНрдЯ рдХреА рдХреБрдВрдЬрд┐рдпреЛрдВ рдХрд╛ рд╕рд░рдгреА рд╣реИ рдЬрд┐рд╕реЗ рд╣рдо рдХрдВрд╕реЛрд▓ рдореЗрдВ рдкреНрд░рджрд░реНрд╢рд┐рдд рдХрд░рдирд╛ рдЪрд╛рд╣рддреЗ рд╣реИрдВред рдорд╛рди рд▓реЗрдВ рдХрд┐ рд╣рдорд╛рд░реЗ рдкрд╛рд╕ рд╡рд╕реНрддреБрдУрдВ рдХреА рдПрдХ рдРрд╕реА рд╕рд╛рд░рдгреА рд╣реИ:

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

... рдФрд░ рд╣рдо рдпрд╣ рджреЗрдЦрдирд╛ рдЪрд╛рд╣рддреЗ рд╣реИрдВ рдХрд┐ рдХреМрди-рд╕реЗ рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛ рд╡реНрдпрд╡рд╕реНрдерд╛рдкрдХ рд╣реИрдВ (рд╡реНрдпрд╡рд╕реНрдерд╛рдкрдХ рдХреЗ рдкрд╛рд╕ "рдкрд╣реБрдВрдЪ" рд╕рдВрдкрддреНрддрд┐ рд╣реИ)ред

рдпрджрд┐ рд╣рдо рдХрдВрд╕реЛрд▓ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддреЗ рд╣реИрдВред Jlog (JSON.stringify (рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛)), рддреЛ рд╣рдореЗрдВ рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рдорд┐рд▓рддреЗ рд╣реИрдВ:

[{"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"}]

рд╕рд╣рдордд рд╣реВрдВ, рдмрд╣реБрдд рдкрдардиреАрдп рдирд╣реАрдВ рд╣реИред

рдЕрдм рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рдкреНрд░рдпрд╛рд╕ рдХрд░реЗрдВ:

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

рдмрд╣реБрдд рдмреЗрд╣рддрд░ред

рдирд┐рд╖реНрдкрдХреНрд╖рддрд╛ рдореЗрдВ, рдпрд╣ рдзреНрдпрд╛рди рджрд┐рдпрд╛ рдЬрд╛рдирд╛ рдЪрд╛рд╣рд┐рдП рдХрд┐ рдЗрд╕ рдорд╛рдорд▓реЗ рдореЗрдВ рд╣рдо



рдХрдВрд╕реЛрд▓.рдЯреЗрдмрд▓ ( рдЙрдкрдпреЛрдЧрдХрд░реНрддрд╛рдУрдВ) рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ: ... рд▓реЗрдХрд┐рди рд╣рдо JSON.stringify () рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдмрд╛рдд рдХрд░ рд░рд╣реЗ рд╣реИрдВ, рдЗрд╕рд▓рд┐рдП рд╣рдо рд╡рд┐рдЪрд▓рд┐рдд рдирд╣реАрдВ рд╣реИрдВред рдЙрджрд╛рд╣рд░рдг рдмрд╣реБрдд рдЕрдЪреНрдЫрд╛ рдирд╣реАрдВ рд╣реИ, рд▓реЗрдХрд┐рди рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рд╡рд┐рдЪрд╛рд░ рд╕реНрдкрд╖реНрдЯ рд╣реИред

2. рджреВрд╕рд░реЗ рддрд░реНрдХ рдХреЗ рд░реВрдк рдореЗрдВ рдПрдХ рдлрд╝рдВрдХреНрд╢рди рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛


рдлрд╝рдВрдХреНрд╢рди рдЗрд╕ рдлрд╝рдВрдХреНрд╢рди рдХреЗ рддрд░реНрдХ рдХреЗ рдЕрдиреБрд╕рд╛рд░ рдХрдбрд╝рд╛рдИ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рджреВрд╕рд░реЗ рддрд░реНрдХ рдХреЗ рд░реВрдк рдореЗрдВ рдкреНрд░рддреНрдпреЗрдХ рдХреБрдВрдЬреА-рдореВрд▓реНрдп рдЬреЛрдбрд╝реА рдХрд╛ рдореВрд▓реНрдпрд╛рдВрдХрди рдХрд░рддрд╛ рд╣реИред рдпрджрд┐ рд╣рдо рдЕрдкрд░рд┐рднрд╛рд╖рд┐рдд рд▓реМрдЯрддреЗ рд╣реИрдВ, рддреЛ рд╕рдВрдмрдВрдзрд┐рдд рдХреБрдВрдЬреА-рдореВрд▓реНрдп рдЬреЛрдбрд╝реА рдкреНрд░рджрд░реНрд╢рд┐рдд рдирд╣реАрдВ рд╣реЛрддреА рд╣реИред рдЙрджрд╛рд╣рд░рдг:

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. рддреАрд╕рд░реЗ рдкреИрд░рд╛рдореАрдЯрд░ рдХреЗ рд░реВрдк рдореЗрдВ рдПрдХ рд╕рдВрдЦреНрдпрд╛ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛


рддреАрд╕рд░рд╛ рддрд░реНрдХ рд░рд┐рдХреНрдд рд╕реНрдерд╛рди рдХреЗ рд▓рд┐рдП рдЬрд┐рдореНрдореЗрджрд╛рд░ рд╣реИред рдпрджрд┐ рдпрд╣ рддрд░реНрдХ рдПрдХ рд╕рдВрдЦреНрдпрд╛ рд╣реИ, рддреЛ рдкреНрд░рддреНрдпреЗрдХ рдкрдВрдХреНрддрд┐ рд╕реНрддрд░ рдкрд░ рдПрдХ рд╕рдорд╛рди рдЗрдВрдбреЗрдВрдЯ рд╣реЛрдЧрд╛:

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

рд╣рдо рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рдкреНрд░рд╛рдкреНрдд рдХрд░рддреЗ рд╣реИрдВ:

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

4. рддреАрд╕рд░реЗ рддрд░реНрдХ рдХреЗ рд░реВрдк рдореЗрдВ рдПрдХ рд╕реНрдЯреНрд░рд┐рдВрдЧ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛


рдпрджрд┐ рддреАрд╕рд░рд╛ рдкреИрд░рд╛рдореАрдЯрд░ рдПрдХ рд╕реНрдЯреНрд░рд┐рдВрдЧ рд╣реИ, рддреЛ рд░рд┐рдХреНрдд рд╕реНрдерд╛рди рдХреЗ рдмрдЬрд╛рдп рдЗрд╕ рд╕реНрдЯреНрд░рд┐рдВрдЧ рдХреЗ рд╡рд░реНрдгреЛрдВ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд┐рдпрд╛ рдЬрд╛рдПрдЧрд╛:

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

рд╣рдо рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рдкреНрд░рд╛рдкреНрдд рдХрд░рддреЗ рд╣реИрдВ:

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

5. рдЯреЛрдиреНрд╕рди рд╡рд┐рдзрд┐


ToJSON рд╡рд┐рдзрд┐ рдХрд┐рд╕реА рднреА рд╡рд╕реНрддреБ рдХреА рд╕рдВрдкрддреНрддрд┐ рд╣реЛ рд╕рдХрддреА рд╣реИред JSON.stringify () рд╕рдВрдкреВрд░реНрдг рдСрдмреНрдЬреЗрдХреНрдЯ рдХреЛ рдХрдирд╡рд░реНрдЯ рдХрд┐рдП рдмрд┐рдирд╛ рдЗрд╕ рдлрд╝рдВрдХреНрд╢рди рдХрд╛ рдкрд░рд┐рдгрд╛рдо рджреЗрддрд╛ рд╣реИ:

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

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

рдмрдХреНрд╢реАрд╢


JSON.stringify () рдФрд░ toJSON () рдХреЗ рдЕрд▓рд╛рд╡рд╛, рдПрдХ json () рд╡рд┐рдзрд┐ рднреА рд╣реИ рдЬреЛ рдПрдХ рд╡рд╛рджрд╛ (рд╡рд╛рджрд╛) рд▓реМрдЯрд╛рддреА рд╣реИред рдЗрд╕ рд╡рд┐рдзрд┐ рдХрд╛ рдЙрдкрдпреЛрдЧ рд╕рд░реНрд╡рд░ рдЕрдиреБрд░реЛрдзреЛрдВ рдореЗрдВ рдХрд┐рдпрд╛ рдЬрд╛рддрд╛ рд╣реИред

рдЙрдкрдпреЛрдЧ рдЙрджрд╛рд╣рд░рдг:

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('')
    }
}

рд╣рдо рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рдкреНрд░рд╛рдкреНрдд рдХрд░рддреЗ рд╣реИрдВ:



рдЖрдкрдХреЗ рдзреНрдпрд╛рди рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рджред

рд╣реИрдкреНрдкреА рдХреЛрдбрд┐рдВрдЧ!

All Articles