반응형
3-1. 데이터 타입과 연산자
기본 타입: Number, String, Boolean, Undefined, Null
참조 타입: Object, Array, Function, 정규식
기본 타입
기본 타입: 하나의 값만을 가짐
참조 타입
참조 타입: key-value 형태로, 여러 개의 프로퍼티를 포함할 수 있음
Ex) window 객체
console.log(window)
리터럴 방식과 new 객체 생성 방식
var obj = new Object(); // 객체 생성자 방식 - 내장에서 들고 있는 클래스
var obj = {}; // 객체 리터럴 방식 - 생성자로 굳이 만들 필요X
new는 엔진을 비교적 더 소모한다. 리터럴을 사용하자
프로퍼티
프로퍼티: 기본 타입, 객체, 배열, 함수 등 모든 타입을 값으로 가질 수 있는 객체
console.log(typeof obj); // console 또한 내장 함수
console.log(typeof obj); // object - typeof는 데이터의 타입을 반환
3-2. 객체 프로퍼티 다루기
var obj = { name: 'ecount', age: 20, office-partition: "803 class" }
1) 대괄호 표기법:
obj['name']
obj['office-partition']
2) 마침표 표기법:
obj.name
// obj.office-partition // 에러
-는 연산자이기 때문에, partition이라는 변수가 정의되지 않았다는 오류가 발생.
가운데 특수문자가 들어간 경우는 대괄호 표기법을 써야 함
3-3. null과 undefined
undefined: 선언만 하고 할당은 안했을 경우
null: 할당은 한 것, 다만 빈 값을 준 것
null === undefined // false - 둘은 다른 것이다
3-4. for ... in
for (var i=0; i < [1,2,3]; i++) { }
for (var i in [1,2,3]) { }
for (var props in obj) {
console.log(props, obj[props]);
}
// 어떤 게 먼저 출력될지 모름 - 순서 보장이 되진 않는다.
// 프로퍼티를 순회할 때 주로 씀
3-5. 프로퍼티 삭제
delete obj.age; // 프로퍼티 삭제됨
delete obj; // obj는 삭제 안됨
3-6. 참조 타입의 특성
JS에서 기본 타입을 제외하고는 모든 값은 객체
객체 비교는 같은 참조값을 가져야 true
var num = 100;
var objA = { value: 100 };
function changeArg(num, obj) {
num = 200;
obj.value = 200;
console.log(num); //200
console.log(obj); // { vlaue: 200 }
}
console.log(num); //100 - 반영 안됨
console.log(obj); //{ value: 200 }; - 변경값이 반영됨
기본 타입을 arguments로 쓸 때는 복사한 값을 사용하고,
참조 타입을 arugments로 쓸 때는 참조값 그대로를 넘기기 때문에 객체의 값을 변경할 수 있습니다.
// 결국 리턴하는 거랑 매개변수로 참조타입 받아서 하는거랑 결과는 같을수있다
// 뭐가 좋고 나쁘고는 없음
var result = {}
function addProps(obj) {
obj.result = true;
}
function resultProps() {
return {
result: true;
}
}
addProps(result);
console.log(result); // { result: true } - 객체가 만들어짐
result = resultProps();
console.log(result); // { result: true } - 객체가 만들어짐
반응형
'JavaScript > JS 초급&개념' 카테고리의 다른 글
[JS] 5장. 자바스크립트의 메모리 관리 (0) | 2023.06.13 |
---|---|
[JS] 4장. 배열 (0) | 2023.06.13 |
[JS] 3장-2. 프로토타입 (0) | 2023.06.13 |
[JS] 2장. 브라우저, 자바스크립트 (0) | 2023.06.13 |
[JS] 1장. ES6란? (0) | 2023.06.13 |