ES6 이전에는 다음과 같은 방법으로 변수를 선언했다.
var username = "jonghan";
현재는 두가지 방법이 더 있다.
let username = "jonghan"; const username = "jonghan";
- const로 선언한 변수에 값을 다시 할당할 수 없다.
- let으로 선언한 변수에는 값을 다시 할당할 수 있다.
자바스크립트는 동적 언어이다. 즉, 정적 언어와 달리 변수를 정의할 때 자료형을 정의할 필요가 없다.
동적 언어 | 정적 언어 | |
---|---|---|
변수의 타입이 정해지는 때 | 런타임 시 | 컴파일 시 |
언어 | phython, javascript | c, java |
장점 | 런타임 전까지 자료형이 정해지지 않기 때문에 코드를 유연하게 짤 수 있다. | 타입 에러를 초기에 발견할 수 있다. 컴파일 시에 미리 타입을 정하기 때문에 실행 속도가 빠르다. |
단점 | 실행 도중에 타입 에러가 발생할 수 있다. | 매번 자료형을 정해줘야 한다. |
자바스크립트에는 총 7개의 자료형이 있는데, 6개의 원시자료형과 객체가 있다.
객체는 여러 속성의 모음을 저장하는 데 사용할 수 있다. 각 속성에는 키와 값이 있다. 키의 자료형읜 string이고 값의 자료형은 함수를 포함한 모든 자료형이 될 수 있다.
const car = new Object();
const car = {};
두 번째 방법이 더 일반적으로 사용되는데, 이를 객체 리터럴이라고 부른다.
car.color='red'; // {color:"red"}
점 표기법을 사용하여 새 속성을 추가했다.
점 표기법 외에도 대괄호 표기법이 있는데 여러 단어로 이루어진 속성의 경우 점 표기법을 사용할 수 없기 때문에 대괄호 표기법을 사용한다.
const car={
"goes fast" : true
};
console.log(car.goes fast); // error
console.log(car['goes fast']); // true
또한 대괄호 표기법은 키를 사용해서 객체의 속성에 접근할 수 있다.
const car={
ferrari:"california",
porsche:"911",
};
const key="ferrari"
console.log(cars.key); // undefined
console.log(cars['key']); // undefined
console.log(cars[key]); // california
let car={
color:'red',
};
let secondCar=car;
여기서 secondCar는 그 자체로 객체가 아니라 car에 대한 참조, 즉 주소를 저장한다. 단순히 car에 대한 참조만 저장하기 때문에 car를 수정하면 secondCar도 변경된다.
객체의 주소를 참조하는 것이 아닌, 객체의 복사본을 만드는 방법은 Object.assign()을 사용하는 방법이다.
const secondCar = Object.assign({},car);
이렇게 하면 car를 업데이트해도 secondCar에 영향을 주지 않는다. Object.assign()의 첫 번째 인수는 복사본에 해당하는 객체이고, 두 번째 인수는 원본에 해당하는 객체이다.