본문 바로가기
Web/JavaScript

JavaScript - 객체

by 개발에정착하고싶다 2023. 1. 6.
320x100

# JavaScript - 객체

 

#1

 

우선 새로웠던 부분은

딕셔너리 기능이다.

파이썬에도 이런 기능이 있을까 싶어서 시도를 해봤다.

 

하지만 파이썬은

i = {‘key’: , ‘ham’:’burger’}

라고 했을때 

SyntaxError: invalid syntax

가 나왔다.

안된다는 소리지..

 

반면, javascript는

 

const profile = {

name : ‘홍길동’,

age: 49,

height: ,

school: ‘코드중학교’

}

 

라고하면 된다고한다 -> (해봤더니 안되는디요;)

 

하지만 그 외적으로 

한가지 재미있는 점은 파이썬을 작성할때는 key값도 다 str취급해서

‘’처리를 해줬는데, javascript에서는 딕셔너리 안의 각각의 변수와 같이 ‘’없이 쓴다는 것이

인상적이였다.


# 2 코드 예시

let friend = {
    name: '철수',
    age: 13,
    camp: '코드캠프'
}
// undefined
friend
// {name: '철수', age: 13, camp: '코드캠프'}
friend.age
// 13
friend.name
// '철수'
friend.camp
// '코드캠프'
friend.toLocaleString
// ƒ toLocaleString() { [native code] }

# 3 약간 심화

 

딕셔너리들을 하나의 리스트 화 시킬수도 있다.

 

const student1 = {name: '바보', age:13}

const student2 = {name:'안녕', age:12}

이것을

 

 

const students = [
	{name: '바보', age:13},
	{name:'안녕', age:12}
]

이렇게 해줄수도 있다.

 

예시

let classmates = [
    { name: '철수', age: 13, school: '다람쥐초등학교' },
    { name: '영희', age: 8, school: '맹인초등학교' },
    { name: '훈이', age: 12, school: '욕심초등학교' }
]
// undefined
classmates
// (3)[{… }, {… }, {… }]0: { name: '철수', age: 13, school: '다람쥐초등학교' } 1: { name: '영희', age: 8, school: '맹인초등학교' } 2: { name: '훈이', age: 12, school: '욕심초등학교' } length: 3[[Prototype]]: Array(0)
classmates[0].school
// '다람쥐초등학교'
classmates.length
// 3
classmates[2].age
// 12

 

# 실시간 인기검색어 가져오는 원리를 구현하기

 

const fruits = [
    { number: 1, title: '레드향' },
    { number: 2, title: '샤인머스켓' },
    { number: 3, title: '산청딸기' },
    { number: 4, title: '한라봉' },
    { number: 5, title: '사과' },
    { number: 6, title: '애플망고' },
    { number: 7, title: '딸기' },
    { number: 8, title: '천혜향' },
    { number: 9, title: '과일선물세트' },
    { number: 10, title: '귤' }
];
// undefined
let laila = fruits[0].number
// undefined
laila
// 1
laila.push(fruits[0].title
// VM4503:1 Uncaught SyntaxError: missing ) after argument list
fruits[0].number + ' ' + fruits[0].title
// '1 레드향'

코드를 보자면 이러하다.

 

중간에 laila로 시도했던게 내가 했던 것이지만, 아무래도 실패했다.

마지막에 구현된 것이 답안 코드인데, 보니깐 이해가 되었다.

300x250