본문 바로가기

Total

(220)
자바스크립트 프로토타입 체이닝 1. 프로토타입의 두 가지 의미 - 자바스크립트는 프로토타입 기반의 객체지향 프로그래밍 - 자바스크립트의 모든 객체는 자신의 부모인 프로토타입 객체를 가리키는 참조 링크 형태의 숨겨진 프로퍼티가 있다. ECSAScript에서는 이러한 링크를 암묵적 프로토타입 링크(implicit prototype link)라고 부른다. = [[Prototype]]링크 - prototype 프로퍼티와 [[Prototype]] 링크를 구분해야 한다. - 자바스크립트에서 모든 객체는 자신을 생성한 생성자 함수의 prototype 프로퍼티가 가리키는 프로토타입 객체를 자신의 부모 객체로 설정하는 [[Prototype]]링크로 연결한다. - 생성된 객체의 실제 부모 역할을 하는 건 생성자 자신이 아닌 생성자의 prototype ..
자바스크립트 함수 호출과 this 1. arguments 객체 - 런타임 시에 호출된 인자의 개수를 확인하고 이에 따라 동작을 다르게 해준다. - 함수를 호출할 때 인수들과 함께 암묵적으로 arguments 객체가 함수 내부로 전달된다. - 이 객체는 인자들을 포함하고 있으며, 실제 배열이 아닌 유사 배열 객체이다. function func(arg1, arg2){ console.log(arg1, arg2); } func(); // 출력 결과 : undefined undefined func(1); // 출력 결과 : 1 undefined func(1, 2) // 출력 결과 : 1 2 func(1, 2, 3) // 출력 결과 : 1 2 //add() 함수 function add(a, b){ //arguments 객체 출력 console.di..
자바스크립트 함수 형태 1.callback 함수 - 어떤 이벤트가 발생했거나 특정 시점에 도달했을 때 시스템에서 호출되는 함수 - 특정 함수의 인자로 넘겨서, 코드 내부에서 호출되는 함수 또한 콜백 함수가 될 수 있다. ex)이벤트 핸들러 처리 콜백 함수 · 웹페이지가 로드 되거나 키보드가 입력되는 등의 DOM 이벤트가 발생할 경우, 브라우저는 정의된 DOM 이벤트에 해당하는 이벤트 핸들러를 실행시킨다. 2. 즉시 실행 함수(immediate function) - 함수를 정의함과 동시에 바로 실행하는 함수 (function(name){ console.log('This is the immediate function -> ' + name); })('foo'); //출력 결과 : This is the immediate functio..
자바스크립트 함수 객체 1. 자바스크립트에서는 함수도 객체다. function add(x, y){ return x + y; } add.result = add(3, 2); add. status = 'OK' console.log(add.result); // 출력값 : 5 console.log(add.status); // 출력값 : 'OK' 2. 함수는 값이다. - 리터럴에 의해 생성 - 변수나 배열의 요소, 객체 프로퍼티 등에 할당 가능 - 함수의 인자로 전달 가능 - 함수의 리턴값으로 리턴 가능 - 동적으로 프로퍼티를 생성 및 할당 가능 위의 기능이 모두 가능한 객체를 일급 객체(First Class Object)라고 부른다. 이러한 일급객체의 특징으로 함수형 프로그래밍이 가능하다. 3. 변수나 프로퍼티의 값으로 할당 가능하다...
자바스크립트 함수 선언 1. 함수를 생성하는 방법 - 함수 선언문(function statement) · 반드시 함수명의 정의되어야 한다. fucntion add(x, y){ return x + y; }//세미콜론을 붙이지 않는 것이 관습 - 함수 표현식(function expression) · 함수 변수를 사용한다. var add = function(x, y){ return x + y; }; //세미콜론을 붙이는 것이 관습 //자바스크립트 파서는 }로 함수가 끝났다고 판단하지 않기 때문에 오류가 날 가능성이 있다. var plus = add; // call by reference - Function() 생성자 함수 · 거의 사용하지 않지만 소스 분석 때 볼 가능성이 있으므로 알아두자 var add = new Function(..
자바스크립트 연산자 특이사항 1. + 연산자 - 더하기 연산과 문자열 연결 연산을 수행한다. 둘다 숫자일 경우만 더하기 연산이 수행된다. 2. typeof 연산자 - null과 배열은 object이고 함수는 function을 리턴한다. 3. ==(동등) 연산자와 ===(일치) 연산자 - == 연산자는 비교하려는 피연산자의 타입이 다를 경우에 타입 변환을 거친다. - === 연산자는 타입을 변경하지 않고 비교한다. ※ 가급적으로 === 연산자로 비교를 하는것을 권한다. 4. !!연산자 - 피연산자를 boolean 값으로 변환한다. ※ 객체는 값이 비어있는 빈 객체라도 true를 반환하는걸 주의해서 사용하라.
자바스크립트 primitive type의 표준 메소드 primitive 타입은 객체가 아닌데 어떻게 메서드를 호출할 수 있을까? primitive 타입은 객체가 아니지만 메서드를 호출할 경우, 이들 기본값은 메서드 처리 순간에 객체로 변환된 다음 각 타입별 표준 메서드를 호출한다. 그리고 메서드 호출이 끝나면 다시 기본값으로 복귀하게 된다. // 숫자 메서드 호출 var num = 0.5; console.log(num.toExponential(1)); // 숫자를 지수 형태의 문자열로 변환한다. 출력값: '5.0e-1' // 문자열 메서드 호출 console.log("test".charAt(1)) // 문자열에서 인자로 받은 위치에 있는 문자를 반환한다. 출력값 : 'e'
자바스크립트 배열 자바스크립트 배열의 경우는 값을 순차적으로 넣을 필요 없이 아무 인덱스 위치에나 값을 동적으로 추가할 수 있다. length 변수 주의사항 1. 자바스크립트 배열의 length 함수는 배열의 크기가 아니라 배열 내 가장 큰 인덱스에 1을 더한 값이다. 2. length를 더큰값으로 수정하면 undefined 값이 들어가고 length를 줄이면 벗어난 인덱스 값이 삭제된다. 3. push() 메서드는 length 프로퍼티 기준으로 동작한다. 배열과 객체의 차이점 ★ 프로토타입이 서로 다르다. - 배열 : Array.prototype → Object.prototype - 객체 : Object.prototype · length 프로퍼티가 존재하지 않음 · push 함수가 존재하지 않음 ☆ 유사 배열 객체 - ..