Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | ||||
4 | 5 | 6 | 7 | 8 | 9 | 10 |
11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 | 19 | 20 | 21 | 22 | 23 | 24 |
25 | 26 | 27 | 28 | 29 | 30 | 31 |
Tags
- Partition
- PostgreSQL
- 개발자
- Lag
- 성장기
- mariadb
- Node.js기본
- ServerSentEvent
- 열공하자
- SSE
- frontend
- EventSource
- 실시간알림
- localStorage
- node.js
- 파티셔닝
- node.js란
- partitioning
Archives
- Today
- Total
써치킴의 우당탕탕 개발 블로그
[JS Essentials][Ch2][클래스] 생성자 함수(prototype) 본문
리터럴 방식의 객체 선언을 하면 메모리를 효율적으로 관리하기 힘들다.
따라서,메모리를 효율적으로 관리하기위해 리터럴 방식이 아닌 JS 클래스를 만든다.
JavaScript Class (자바스크립트 클래스) : 프로토타입을 사용해서 new를 통해 생성자 함수로 인스턴스를 만들어내는 것.
다른 프로그래밍 언어의 Class와는 다른 개념이다.
// 리터럴 방식
// 속성, 메소드를 통들어서 멤버(Member)라고 부름.
const searchkim = {
firstName : 'Search', // 속성
lastName : 'Kim', // 속성
getFullName : function () { // 메소드
return `${this.firstName} ${this.lastName}`; // 데이터 보관
}
}
console.log(searchkim.getFullName());
// 메모리를 효율적으로 관리하기위해 리터럴 방식이 아닌 JS 클래스를 만든다.
// 프로토타입을 사용해서 new를 통해 생성자 함수로 인스턴스를 만들어내는 것을 JavaScript 클래스라고 한다.
// (다른 프로그래밍 언어의 Class와는 다른 개념)
function User(first, last) { // 생성자 함수
this.firstName = first;
this.lastName = last;
}
User.prototype.getFullName = function () { // prototype 속성에 함수를 만들어주면 메모리에 한번만 생성됨
return `${this.firstName} ${this.lastName}`; // 데이터 보관
}
// new를 통해서 user 함수 실행 -> 생성자 함수 : 하나의 객체 데이터 생성
// 생성자 함수를 반환한 변수를 인스턴스라고 한다. (ex. search, amy, neo)
const search = new User('Search', 'Kim');
const amy = new User('Amy', 'Kim');
const neo = new User('Neo', 'Kim');
console.log(search);
console.log(search.getFullName());
console.log(amy.getFullName());
console.log(neo.getFullName());
! 생성자 함수와 일반 함수는 function 키워드를 사용하기 때문에 구분할 수 없다.
그러므로, 생성자 함수와 일반 함수를 구분하기 위해 암묵적으로
new라는 키워드와 같이 사용되는 생성자 함수를 PasterCase(첫번째 단어를 대문자로) 기법으로 시작하도록 작성한다.
'파도파도 나오는 JavaScript' 카테고리의 다른 글
[JS Essentials][Ch2][클래스] ES6 Classes (0) | 2022.01.28 |
---|---|
[JS Essentials][Ch2][클래스] this (0) | 2022.01.28 |
[JS Essentials][Ch2][함수] 콜백 (Callback) (0) | 2022.01.28 |
[JS Essentials][Ch2][함수] 타이머 함수 (0) | 2022.01.28 |
[JS Essentials][Ch2][함수] 호이스팅 (Hoisting) (0) | 2022.01.28 |
Comments