[JavaScript] 자바스크립트 정리해두기

자바스크립트의 기능

• html제어하기

자료형

• Number: 숫자(정수, 실수)
• String: 문자열
• Boolean: 참 거짓
• Null: 비어있다.
• Undefined: 정의되지 않았다.
• NaN: 숫자가 아니다.
• Object: 객체
• function: 함수

변수

• var

네이밍

• 카멜 케이스
  numApple

• 스네이크 케이스
  num_apple

배열

객체타입이다. 각 원소의 값의 타입이 다를 수 있다.

var arr=[];
arr.push(10); 
arr.push("hello");

.length

배열의 길이를 구함. 중간에 빈 값이 있어도 요소가 있다고 생각.

push & pop

push: 배열의 맨 뒤에 값 삽입
arr.push(10);

pop: 배열의 맨 뒤에 값 삭제
arr.pop();

unshift & shift

unshift: 배열의 맨 앞에 값 삽입
arr.unshift(10);

shift: 배열의 맨 앞의 값 삭제
arr.shift();

문자열 vs 배열

문자열은 바꿀 수 없고, 배열은 내용을 바꿀 수 있다.

함수

선언

var funcName = function(num) {
    // 함수 실행 내용 
    return 값이 있는 경우. 없는 경우(void)는 return을 안 해주면 됨
}

호출

funcName(10);

var x = funcName(10); // 리턴 값이 있을 경우 리턴 값이 x에 들어감 

객체

var obj = {}; // 빈 객체

var obj = {  // JSON 
    "name": "js",
    "age" : 25,
    "bye" : function(name) {
        // ...
    }
};

속성 만들기

obj.attrName = attrValue;

ex) obj.name = "js";

속성으로 함수를 줄 수도 있다.(메소드)

obj.hello = function(name) {
   console.log("hello" + name + "!");
}

this

자기 자신을 나타낸다.

obj.hello = function(name) {
    console.log(this.name + "이 " + name + "에게 인사했습니다");
}

생성자를 사용한 객체 여러개 생성

var Human = function(name, age, weight) {
    this.name=name;
    this.age=age;
    this.weight=weight;
}

// 공통 메소드를 프로토타입을 이용하여 하나만 생성하여 메모리 낭비 막음
Human.prototype.sleep = function(time) {
        console.log(this.name + "이 " + time + "시간 동안 잠들었습니다.");
}

var p1 = new Human('junseo', 25, 68);
var p2 = new Human('je', 28, 50);
//....