3-13
// 배열 리터럴을 통한 배열 생성
var colorArr = ['orange', 'yellow', 'blue', 'green', 'red'];
console.log(colorArr[0]);
console.log(colorArr[1]);
console.log(colorArr[3]);
console.log(colorArr[4]);
orange
yellow
green
red
객체 리터럴 { ]
배열 리터럴 [ ]
* 0부터 시작
3-14
// 빈 배열
var empty = [];
console.log(empty[0]); //undefined
// 배열 요소 동적 생성
empty[0] = 100;
empty[3] = 'eight';
empty[7] = 'true';
console.log(empty);
console.log(empty.length);
undefined
[ 100, <2 empty items>, 'eight', <3 empty items>, 'true' ]
8
동적으로 배열 원소 추가하기
추가 전이나 1,2,4,5,6번째는 추가되지 않았으므로 undefined
배열 요소의 개수는 0~7 총 8개
3-15
var arr = [];
console.log(arr.length);
arr[0] = '0';
arr[1] = '1';
arr[2] = '2';
arr[100] = '100';
console.log(arr.length);
0
101
배열 내 가장 큰 인덱스(100)+1=101
3-16
var arr = [0, 1, 2];
console.log(arr.length);
arr.length = 5;
console.log(arr);
arr.length = 2;
console.log(arr);
console.log(arr[2]);
3
[ 0, 1, 2, <2 empty items> ]
[ 0, 1 ]
undefined
length 프로퍼티를 벗어난 2는 삭제 되었다.
3-17
// arr 배열 생성
var arr = ['a', 'b', 'c'];
// push() 매서드 호출
arr.push('d');
console.log(arr);
// length 값 변경 후, push()
arr.length = 5;
arr.push('e');
console.log(arr);
[ 'a', 'b', 'c', 'd' ]
[ 'a', 'b', 'c', 'd', <1 empty item>, 'e' ]
length 프로퍼티값을 5로 바꾸면 d 뒤에 할당 되지 않은 빈 인덱스가 생긴다.
3-18
var colorsArray = ['a', 'b', 'c'];
console.log(colorsArray[0]);
console.log(colorsArray[1]);
console.log(colorsArray[2]);
var colorsObj = {
'0' : 'a',
'1' : 'b',
'2' : 'c'
};
console.log(colorsObj[0]);
console.log(colorsObj[1]);
console.log(colorsObj[2]);
console.log(typeof colorsArray);
console.log(typeof colorsObj);
console.log(colorsArray.length);
console.log(colorsObj.length);
colorsArray.push('d');
colorsObj.push('d');
a
b
c
a
b
c
object
object
3
undefined
colorObj는 객체이므로 length 프로퍼티가 존재하지 않고 배열이 아니므로 push 메서드가 사용 불가능 하다.
3-20
// 배열 생성
var arr = ['a', 'b', 'c'];
console.log(arr.length);
// 프로퍼티 동적 추가
arr.color = 'blue';
arr.name = 'number_array';
console.log(arr.length);
// 배열 원소 추가
arr[3] = 'red';
console.log(arr.length);
console.dir(arr);
3
3
4
[ 'a', 'b', 'c', 'red', color: 'blue', name: 'number_array' ]
배열에 동적 프로퍼티가 추가될 경우 배열의 length 값이 3으로 바뀌지 않는다.
3-21
// 배열 생성
var arr = ['a', 'b', 'c'];
console.log(arr.length);
// 프로퍼티 동적 추가
arr.color = 'blue';
arr.name = 'number_array';
console.log(arr.length);
// 배열 원소 추가
arr[3] = 'red';
console.log(arr.length);
console.dir(arr);
for (var prop in arr) {
console.log(prop, arr[prop]);
}
for (var i=0; i<arr.length; i++) {
console.log(i, arr[i]);
}
3
3
4
[ 'a', 'b', 'c', 'red', color: 'blue', name: 'number_array' ]
0 a
1 b
2 c
3 red
color blue
name number_array
0 a
1 b
2 c
3 red
3-22
var arr = ['a', 'b', 'c', 'd'];
delete arr[2];
console.log(arr);
console.log(arr.length);
[ 'a', 'b', <1 empty item>, 'd' ]
4
delete로 2번 배열 요소를 삭제하면 undefined가 할당되지만 length 값은 변하지 않는다.
3-23
var arr = ['a', 'b', 'c', 'd'];
arr.splice(2, 1);
console.log(arr);
console.log(arr.length);
[ 'a', 'b', 'd' ]
3
2번째 위치부터 1개의 요소를 삭제
3-24
var foo = new Array(3);
console.log(foo);
console.log(foo.length);
var bar = new Array(1, 2, 3);
console.log(bar);
console.log(bar.length);
[ <3 empty items> ]
3
[ 1, 2, 3 ]
3
Array() 생성자 함수를 호출할 때 3이라는 숫자 인자 하나만 넘겼으므로 3개의 빈(undefined)요소가 생성된다.
3-25
var arr = ['bar'];
var obj = {
name : 'foo',
length : 1
};
arr.push('baz');
console.log(arr);
obj.push('baz');
[ 'bar', 'baz' ]
error
배열인 arr은 push를 활용해 원소를 추가할수 있지만, 유사 배열 객체 obj는 배열이 아니므로 불가능 하다.
3-26
var arr = ['bar'];
var obj = {
name : 'foo',
length : 1
};
arr.push('baz');
console.log(arr);
Array.prototype.push.apply(obj, ['baz']);
console.log(obj);
[ 'bar', 'baz' ]
{ '1': 'baz', name: 'foo', length: 2 }
apply()메서드를 사용하면 객체지만 표준 배열 메서드를 활용 가능하다.
3-27
// 숫자 메서드 호출
var num = 0.5;
console.log(num.toExponential(1));
// 문자 메서드 호출
console.log("test".charAt(2));
5.0e-1
s
숫자, 문자열, 불린값은 기본 타입이라 타입별로 호출 가능한 표준 메서드가 있지만 기본 타입도 객체처럼 호출 가능하다.
toExponential(1)는 숫자를 지수 형태의 문자열로 변환 (소수점 첫번째 자리까지) charAt(2)는 문자열에서 인자로 받은 위치에 있는 문자를 반환 (문자열 인덱스는 0부터 시작하므로 test의 2번째 인덱스는 s)
3-28
var add1 = 1 + 2;
var add2 = 'my' + 'string';
var add3 = 1 + 'string';
var add4 = 'string' + 2;
console.log(add1);
console.log(add2);
console.log(add3);
console.log(add4);
3
mystring
1string
string2
+연산자는 더하기위 문자열 연결을 한다.
두 연산자가 모두 숫자일 경우엔 더하기, 그 외에는 문자열 연결을 한다.
3-29
console.log(1 == '1');
console.log(1 === '1');
true
false
==는 단순 값만 비교를 하고 ===는 값과 타입을 비교한다.
3-30
console.log(!!0);
console.log(!!1);
console.log(!!'string');
console.log(!!'');
console.log(!!true);
console.log(!!false);
console.log(!!null);
console.log(!!undefined);
console.log(!!{});
console.log(!![1,2,3]);
false
true
true
false
true
false
false
false
true
true
!!의 역할은 피연산자를 불린값으로 변환하는 것이다.
* 객체는 값이 비어있어도 true로 변환된다.