[JAVASCRIPT] 이론 1

JavaScript - 1

자바스크립트는 하나의 숫자형 Number 타입만 존재하고 double과 같이 64비트 실수로 저장한다.

var num = 5 / 2;
console.log(num); // 2.5
console.log(Math.floor(num)); // 2
console.log(Math.ceil(num)); // 3

in 키워드를 사용하였을 경우 property의 키 값에 해당된다
배열의 경우 인덱스, 프로퍼티의 경우 key 값

var str = "my test";
for (str_temp of str) {
    console.log(str_temp);
} // m y  t e s t 출력

for (str_temp in str) {
    console.log(str_temp);

객체

객체 생성 두가지 방법
객체는 key:value 형태의 프로퍼티들을 저장하는 컨테이너로 표현된다.

1. 객체 리터럴 방식

var hoyoung = {
    name : "hoyoung",
    age : 24,
};

2. Object 생성자 함수를 통한 객체 생성

var hoyoung2 = new Object();
hoyoung2.name = "Jung hoyoung";
hoyoung2.age = 24;

대괄호 표기법을 해야되는 경우 => key에 -가 포함되어 있는 경우
delete 키워드로는 프로퍼티는 삭제가능하지만 객체는 삭제 못한다.

//프로퍼티 읽기
console.log(hoyoung2.name); // Jung hoyoung
console.log(hoyoung2['name']); // Jung hoyoung
console.log(hoyoung2.hobby); // undefined


delete hoyoung2.age; // 프로퍼티는 삭제가능
delete hoyoung2; // 객체는 삭제 불가능

객체 비교

var a = 10; // 기본 타입
var b = 10;

console.log(a==b); // true
var obj1 = {value : 100}; // 참조 타입
var obj2 = {value : 100};
var obj3 = obj2;

console.log(obj1 == obj2); // false
console.log(obj2 == obj3); // true

객체 호출 방식

기본타입의 경우 값에 의한 호출, 참조타입의 경우 주소에 대한 참조에 의한 호출 방식

var a = 100;
var obj = {value : 100};

function changeArg(num, obj) {
    num = 200;
    obj.value = 200;

    console.log(num, obj.value); // 200, 200
}

changeArg(a, obj);
console.log(a, obj.value); // 100, 200

프로토타입

모든 객체는 자신의 부모 역할을 하는 객체와 연결되어 있으며 부모 객체를 프로토타입 객체 또는 프로토타입이라고 부른다.

크롬브라우저에서는 __proto__ 라는 숨겨진 프로퍼티를 가지고 toString(), valueOf() 와 같은 메서드를 내장하고 있다.

var hoyoung2 = {
    name : 'hoyoung2',
    age : 24
}

console.log(hoyoung2); // {name: 'hoyoung2', age: 24}
console.log(hoyoung2.toString()); // [object Object]

배열

값을 순차적으로 넣을 필요 없으며 동적으로 요소를 추가 가능하다.
배열은 length() 와 push() 등 프로퍼티를 가지고 있다.
배열은 객체 타입이기 때문에 프로퍼티가 추가 되지만 인덱스에 영향을 주지 않는다.

var arr = [];
arr[0] = 10;
arr[9] = 10;
console.log(arr.length); // 10
console.log(arr); // (10) [10, empty × 8, 10]
arr.length = 2;
console.log(arr); // (2) [10, empty]

arr.push('hello'); 
console.log(arr); // (3) [10, empty, 'hello']

var test_arr = [1, 2, 3];
console.log(test_arr.length); // 3
test_arr.name = 'test_arr';
test_arr.length = test_arr.length;
console.log(test_arr.length); // 3
test_arr[3] = 4;
console.log(test_arr.length); // 4
console.log(test_arr); 

배열과 객체의 프로토타입 비교

Array 생성자

배열 타입에서의 push(), 오브젝트 타입에서의 apply()

console.log(test, test.length); //(3) [empty × 3] length : 3

var arr = [1, 2, 3];
arr.push(4);
console.log(arr);

var obj = {
    name : "obj_test"
}
// obj.push(baz); // error
Array.prototype.push.apply(obj, ['baz']);
console.log(obj); // {0: 'baz', name: 'obj_test', length: 1}

+ 연산

+ 연산자는 숫자만 있을 때는 더하기 연산, 문자열이 하나라도 있을 때는 문자열을 잇는 역할을 한다.

console.log( 1 + 2 ); // 3
console.log( 'my' + "test"); // mytest
console.log( 1 + "my test"); // 1my test

함수

이름이 없는 함수 형태 == 익명함수
이름이 있는 함수 형태 == 기명함수
함수도 객체이기 때문에 프로퍼티 추가 가능하다.

function minus(x, y) {
    return x - y;
};

console.log(minus(5, 2)); // 3
var minus_fun = minus;
console.log(minus_fun(5, 3)); // 2

var plus = function (x, y) { // function 이름은 `plus` 가 생략된 형태임.
    return x + y;
}

console.log(plus(2,4)); // 6

plus.name = "더하기 연산을 해주는 함수 입니다."; 
plus.status = 'OK';

함수는 프로퍼티의 value로 할당 될 수 있다.

var value_func = function () {
    return 1400;
}

var obj = {
    name : "test_obj",
    value : value_func()
}
console.log(obj); // {name: 'test_obj', value: 1400}

함수 매개변수를 인자안에 넣어 함수를 호출 할 수 있다.

var func = function(func2) {
    func2();
};

function func2() {
    console.log("func2 매개변수를 인자로 받아 출력합니다");
};

func(func2);

함수의 length 프로퍼티는 함수의 인자의 갯수를 나타낸다.

console.log(func2.length); // 0
function func3(x, y) {
    return console.log(x, y);
}
console.log(func3.length); // 2