# 자바스크립트 학습
# Object 오브젝트
## 자바스크립트의 오브젝트
- 자바스크립트의 오브젝트는 , 빌트인 오브젝트 (Built-in Object), 빌트인 오브젝트 (Native Object), 호스트 오브젝트 (Host Object)로 구분한다.
- 빌트인 오브젝트 : 사전에 만드러 놓은 오브젝트로 빌트인 Number 오브젝트, 빌트인 String 오브젝트 등이 있다.
- 네이티브 오브젝트 : 자바스크립트 스펙에 정의된 오브젝트이다. 빌트인 오브젝트에 포함되며, 여기에 자바스크립트를 실행 할 때 만드는 오브젝트가 있다. (자바스크립트를 실행 할 때 만드는 오브젝트 : Argument 오브젝트)
- 호스트 오브젝트 : 빌트인, 네이티브 오브젝트를 제외한 오브젝트이다. (window 오브젝트, DOM 오브젝트가 있다.) 자바스크립트 호스트 환경에서 브라우저의 모든 요소 기술을 연결하고 융합하며 이를 제어한다.
var node = document.querySelector("div");
log(node.nodeName);
=>
DIV
- (DOM 오브젝트는 주로 마우스 클릭에 대한 인식과 관련)
## 오브젝트와 인스턴스
- 오브젝트 : new 연산자를 사용하지 않고, 빌트인 오브젝트로 만든 오브젝트를 지칭한다.
var abc = new Object();
var obj = {};
=>
abc, obj 모두 인스턴스를 생성
하지만 abc의 경우 new 연산자를 사용하여 abc 인스턴스라고 부른다.
obj의 경우는 new 연산자를 사용하지 않았으므로 obj 오브젝트라고 부른다.
# 빌트인 Object 프로퍼티 (ES3)
## 프로퍼티 리스트 (ES3)
| 이름 |
개요 |
| new Object() |
파라미터 데이터 타입의 인스턴스 생성 |
| Object() |
Object 인스턴스 생성 |
Object prototype
|
| constructor |
생성자 |
| valueOf() |
프리미티브 값 반환 |
| hasOwnProperty() |
프로퍼티 소유 여부 반환 |
| propertyIsEnumerable() |
프로퍼티 열거 여부 반환 |
| isPrototypeOf() |
prototype의 존재 여부 반환 |
| toString() |
문자열로 변환 |
| toLocaleString() |
지역화 문자열로 변환 |
# Object 인스턴스 생성
## new Object()
| 구분 |
데이터(값) |
| 파라미터 |
값opt |
| 반환 |
생성한 인스턴스 |
- new 연산자로 Object() 생성자 함수를 호출하면 인스턴스를 생성하여 반환한다.
- 파라미터의 데이터 타입에 따라서 생성할 인스턴스 타입이 결정된다.
var newNum = new Number(123);
web.log(typeof newNum);
web.log(newNum + 100);
=>
object
223
var newObj = new Object(123);
web.log(typeof newObj);
web.log(newObj + 100);
=>
object
223
new Object는 파라미터의 값에 따라 인스턴스 타입이 결정된다.
new Object의 파라미터 값이 String 이면 String 인스턴스가 생성된다.
- 파라미터의 값이 undefined, null이면 빈 Object 인스턴스를 반환한다.
var newObj = new Object();
web.log(newObj);
=>
{}
파라미터를 작성하지 않을경우 undefined를 작성한 것과 같으므로,
값을 갖지 않은 Object 인스턴스를 생성하게 된다.
## Object()
| 구분 |
데이터(값) |
| 파라미터 |
값opt |
| 반환 |
생성한 인스턴스 |
- Object() 함수는 Object 인스턴스를 생성한다. (new 연산자를 사용하지 않은 것 뿐)
- 파라미터에는 {name:value} 형태로 작성한다.
var obj = Object({name: "JS책"});
log(obj);
var emptyObj = Object();
log(emptyObj);
=>
{name: JS책}
{}
## Object 생성 방법
var abc = {};
var abc = Object()
=>
위 두개는 동일하다.
즉, var abc = {} 실행 시 Object 인스턴스가 생성된다.
- {} (중괄호) 표기는 오브젝트 리터럴(Literal) 이라고 부른다.
var obj = Object({name: "Value"});
log(obj);
log(obj instanceof Object);
=>
{name: value}
true
- Object() 와 Object 리터럴{} 모두 Object 인스턴스를 생성한다. 그래서 Object()를 사용하지 않고, 간단하게 {}를 사용한다.
## valueOf()
| 구분 |
데이터(값) |
| data |
Object 인스턴스, 숫자 |
| 파라미터 |
사용하지 않음 |
| 반환 |
프리미티브 값 |
- data 위치에 작성한 Object 인스턴스의 프리미티브 값을 반환한다.
var obj = {key: "value"};
log(obj.valueOf());
=>
{key: value}
# 빌트인 오브젝트의 구조
## 빌트인 오브젝트 구조
- 오브젝트 이름 : Object, String, Number 등등..
- 오브젝트.prototype
1. prototype은 인스턴스를 생성하는 기준이다.
2. prototype이 있으면 인스턴스 생성이 가능하고, 없으면 생성할 수 없다.
3. prototype은 프로퍼티를 연결하는 오브젝트이다. (오브젝트.prototype)
- 오브젝트.prototype.constructor : 오브젝트 생성자
- 오브젝트.prototype.method : 메소드 이름과 함수 작성
# 함수와 메소드
## 함수와 메소드 연결
Object.create()
- 메소드는 오브젝트의 prototype에 연결한다.
Object.prototype.toString()
## 함수와 메소드 호출
Object.create();
log(Object.create);
log(Object.prototype.create);
=>
function create() { [native code] }
undefined
해당 함수가 존재하면 함수가 출력,
없으면 undefined 출력
Object.prototype.toString()
으로 호출 하거나
또는 아래와 같이 인스턴스를 생성하여 호출한다.
log(Object.prototype.toString);
var obj = {};
log(obj.toString);
=>
function toString() { [native code] }
function toString() { [native code] }
1. 자바스크립트 코드 작성 방법이 다르기 때문이다.
2. 함수는 파라미터에 값을 작성하고, 메소드는 메소드 앞에 값을 작성하기 때문이다.
log(String.fromCharCode(40, 65));
=>
1A
## 메소드와 메서드
- 국립국어원 표준국어대사전에서 메소드는 검색되고 메서드는 검색되지 않는다.
- 메소드는 프로그램과 관련지어 설명하고 있다.
- 그러므로 되도록이면 메소드로 사용. 그렇다고 해서 메서드가 틀린건 아님(메소드의 발음 기호가 메서드)