혼자 공부하는 자바스크립트 6장 - 객체(2)

1. 여러 객체의 메소드들

1) Number 객체

- toFixed() : 숫자 N번째 자리수 까지 출력하기

const n = 123.456789

n.toFixed(2)
=> 123.46

n.toFixed(3)
=> 123.457

n.toFixed(4)
=> 123.4568

- isNaN() : Nan 확인하기

const n = Number('문자')

n
=> NaN

//NaN과의 비교연산자로는 비교할 수 없음
n == NaN
=> false

//isNaN을 사용해야 비교할 수 있음
Number.isNaN(n)
=> true

- isFinite() : infinity 확인하기

const a = 10 / 0

a
=> Infinity

const b = -10 / 0

b
=> -Infinity

Number.isFinite(a)
=> false

Number.isFinite(b)
=> false

// Infinity는 비교연산자로 비교 가능
a == Infinity || b == -Infinity
=> true

 

2) String 객체

- trim() : 문자열 양쪽 끝의 공백 없애기

stringA = "		안녕하세요		"
stringB = "		공백이 아주 많습니다		"

stringA.trim()
=>"안녕하세요"
stringB.trim()
=>"공백이 아주 많습니다"

- split() : 문자열을 특정 기호로 자르기

stringC = "
사과,바나나,포도,복숭아
국어,수학,영어,과학"

stringC = stringC.split('\n')
=>["사과,바나나,포도,복숭아","국어,수학,영어,과학"]

stringC = stringC.map((line)=>line.split(','))
=>[Array(4),Array(4)]

 

3) JSON 객체

- 자바스크립트의 객체처럼 자료를 표현하는 방식

- JSON.stringfy() : 자바스크립트 객체를 JSON 문자열로 변환

- JSON.parse() : JSON 문자열을 자바스크립트 객체로 변환

 

4) Math 객체

- 수학과 관련된 기본적인 연산을 할때 사용하는 객체

- pi,e같은 수학 상수, Math.sin(). Math.cos(), Math.tan(), Math.random() 과 같은 함수들도 있다.

 

2. 속성 존재 여부 확인

 

1) 조건문 활용

if (object.속성) {
	console.log('속성이 있습니다')
} else {
	console.log('속성이 없습니다')
}

2) 짧은 조건문 활용

object.속성 || console.log('속성이 있습니다')}

3) 짧은 조건문 응용

object.속성 = object.속성 || '미정'

 

3. 다중할당

 

1) 배열 기반의 다중 할당

[식별자, 식별자, 식별자, ...] = 배열

let arr = [1,2,3,4]
[a,b] = arr

console.log(a,b)
=> 1,2

2) 객체 기반의 다중 할당

{속성이름, 속성 이름} = 객체
{식별자 = 속성이름, 식별자 = 속성 이름} = 객체

const student = {
	name : '김철수'
    age : 17
    grade : '고등학교 1학년'
}

const {name, age} = student
console.log(name,age)
=> 김철수 17

const {a = name, b = grade} = student
console.log(a,b)
=> 김철수 고등학교 1학년

 

4. 전개 연산자

- 배열과 객체를 할당할때 이름만 다르고 같은 내용을 가르키는 것을 얕은 복사라고 한다.

- 각자 독립된 배열이나 객체를 만들려면 깊은 복사를 해야한다.

- 깊은 복사를 하기 위해서는 전개 연산자가 필요하다.

 

1) 배열 전개 연산자

[...배열]

const 물건 = ['연필','지우개']
const 물건2 = [...물건]
물건2.push('자')
물건2.push('샤프')

console.log(물건)
=> ['연필','지우개']
console.log(물건2)
=> ['연필','지우개', '자','샤프']

- 전개 연산자를 통해 요소 추가도 가능하다.

[...배열,자료,자료,자료]

const 물건 = ['연필','지우개']
const 물건2 = ['자', ...물건, '샤프']

console.log(물건)
=> ['연필','지우개']
console.log(물건2)
=> ['자', '연필', '지우개', '샤프']

 

2) 객체 전개 연산자

{...객체}

const 바나나 = {
	fruit : '바나나'
    price : 4000
}
const 포도 = {...바나나}
포도.fruit = '포도'
포도.price = 5000

console.log(JSON.stringfy(바나나))
=> {'fruit':'바나나','price':4000}
console.log(JSON.stringfy(포도))
=> {'fruit':'포도','price':5000}

- 전개 연산자를 통해 속성 추가도 가능하다.

{...객체,자료,자료,자료}

const 바나나 = {
	fruit : '바나나'
    price : 4000
}
const 포도 = {
	...바나나,
    fruit = '포도',
    price = 5000
    variety = '샤인머스캣'
    }

console.log(JSON.stringfy(바나나))
=> {'fruit':'바나나','price':4000}
console.log(JSON.stringfy(포도))
=> {'fruit':'포도','price':5000,'variety':'샤인머스캣'}