\ub9ac\uc561\ud2b8\ub294 \ud604\ub300 \uc6f9 \uac1c\ubc1c\uc5d0\uc11c \uac00\uc7a5 \ub110\ub9ac \uc0ac\uc6a9\ub418\ub294 \ub77c\uc774\ube0c\ub7ec\ub9ac \uc911 \ud558\ub098\ub85c, \uc0ac\uc6a9\uc790 \uc778\ud130\ud398\uc774\uc2a4\ub97c \uad6c\ucd95\ud558\ub294 \ub370 \ub9e4\uc6b0 \ud6a8\uacfc\uc801\uc785\ub2c8\ub2e4. \uc774\ubc88 \uac15\uc88c\uc5d0\uc11c\ub294 \ub9ac\uc561\ud2b8\uc5d0\uc11c \uac1d\uccb4\ub97c \ub2e4\ub8e8\ub294 \ubc29\ubc95\uc5d0 \ub300\ud574 \uc790\uc138\ud788 \uc0b4\ud3b4\ubcf4\ub3c4\ub85d \ud558\uaca0\uc2b5\ub2c8\ub2e4. \uac1d\uccb4\ub294 JavaScript\uc758 \ud575\uc2ec \uac1c\ub150 \uc911 \ud558\ub098\ub85c, \ub9ac\uc561\ud2b8\uc5d0\uc11c \uc0c1\ud0dc \uad00\ub9ac \ubc0f \ub370\uc774\ud130 \uc804\uc1a1\uc5d0 \uc911\uc694\ud55c \uc5ed\ud560\uc744 \ud569\ub2c8\ub2e4.<\/p>\n
\uac1d\uccb4\ub294 \ud504\ub85c\ud37c\ud2f0(\uc18d\uc131)\uc640 \uba54\uc11c\ub4dc(\ud568\uc218)\ub97c \ud3ec\ud568\ud558\ub294 \ub370\uc774\ud130 \uad6c\uc870\uc785\ub2c8\ub2e4. JavaScript\uc5d0\uc11c \uac1d\uccb4\ub294 \uc911\uad04\ud638({})\ub85c \ubb36\uc5ec \uc788\ub294 key-value \uc30d\uc73c\ub85c \uad6c\uc131\ub429\ub2c8\ub2e4. \uc608\ub97c \ub4e4\uc5b4, \ub2e4\uc74c\uacfc \uac19\uc740 \uac1d\uccb4\ub97c \uc0dd\uc131\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4:<\/p>\n
const person = {\n name: '\ud64d\uae38\ub3d9',\n age: 30,\n greet: function() {\n console.log(`\uc548\ub155\ud558\uc138\uc694, \uc800\ub294 ${this.name}\uc785\ub2c8\ub2e4!`);\n }\n};<\/code><\/pre>\n\uc704 \ucf54\ub4dc\ub294 person<\/code>\uc774\ub77c\ub294 \uac1d\uccb4\ub97c \uc0dd\uc131\ud558\uba70, name<\/code>\uacfc age<\/code>\ub77c\ub294 \uc18d\uc131\uc744 \ud3ec\ud568\ud569\ub2c8\ub2e4. \ub610\ud55c, greet<\/code>\ub77c\ub294 \uba54\uc11c\ub4dc\ub97c \ud1b5\ud574 \uac1d\uccb4\uc758 \uc815\ubcf4\ub97c \ucf58\uc194\uc5d0 \ucd9c\ub825\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4.<\/p>\n2. \uac1d\uccb4\uc758 \ud65c\uc6a9<\/h2>\n
\ub9ac\uc561\ud2b8\uc5d0\uc11c \uac1d\uccb4\ub294 \ub2e4\uc591\ud55c \uc6a9\ub3c4\ub85c \uc0ac\uc6a9\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4. \ub2e4\uc74c\uc740 \ub9ac\uc561\ud2b8 \ucef4\ud3ec\ub10c\ud2b8\uc5d0\uc11c \uac1d\uccb4\ub97c \ud65c\uc6a9\ud558\ub294 \uba87 \uac00\uc9c0 \uc608\uc785\ub2c8\ub2e4:<\/p>\n
2.1 \uc0c1\ud0dc \uad00\ub9ac<\/h3>\n
\ub9ac\uc561\ud2b8 \ucef4\ud3ec\ub10c\ud2b8\uc5d0\uc11c \uc0c1\ud0dc\ub97c \uad00\ub9ac\ud560 \ub54c \uac1d\uccb4\ub97c \uc0ac\uc6a9\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4. \uc608\ub97c \ub4e4\uc5b4, \uc5ec\ub7ec \uac1c\uc758 \uc18d\uc131\uc744 \uac00\uc9c4 \uc0c1\ud0dc\ub97c \uac1d\uccb4\ub85c \uc815\uc758\ud560 \uc218 \uc788\uc2b5\ub2c8\ub2e4:<\/p>\n
import React, { useState } from 'react';\n\nconst UserProfile = () => {\n const [user, setUser] = useState({\n name: '\ud64d\uae38\ub3d9',\n age: 30,\n email: 'hong@example.com'\n });\n\n const updateUserName = (newName) => {\n setUser(prevUser => ({\n ...prevUser,\n name: newName\n }));\n };\n\n return (\n \n \uc0ac\uc6a9\uc790 \ud504\ub85c\ud544<\/h2>\n
\uc774\ub984: {user.name}<\/p>\n
\ub098\uc774: {user.age}<\/p>\n
\uc774\uba54\uc77c: {user.email}<\/p>\n