2015년 10월 31일 토요일

객체지향 자바스클립트의 원리

1장 원시타입과 참조타입

: 자바스크립트는 일급함수이다.
원시타입 : Boolean,Null,String,Number,Undefiend
참조타입 : 객체를 말함. 객체는 참조를 한다음 반드시  null 해주는게 좋다.

-프로퍼티의 접근 아래와 같은 경우도 가능하다.
var array = [];
var method = "push";
array[method](12345); <- 즉 array.push(12345) 와 같다. !!!!

-객체의 확인은 instansof 와  typeof 로 가능하다.

-원시래퍼 타입  : 자바스크립트엔진은 사실 간단한문자열 대입시에도 string 을 생성후 널처리 하기 때문에 스트링에 함수로 각종 처리를 할수 있다.

2.함수

:자바스크립트에서 함수는 객체다.

함수는 함수 선언(function delcaration)  과  함수표현식(function expresion) 이 있다.
함수선언: 은 hoist 되기 때문에 자바스크립트 엔진에서 함수를 최상단으로 끌어 올려 지게 된다.
result = add (1,2); // 아래 add 함수가 자바스크립트엔진에 의해 상단으로 올려지기 때문에 실행가능
function add( num1, num2){
return num1+num2;
}

함수표현식:
result=add(1,2); //이건 안됨. 함수표현식은 선언과 동시에 정의되기때문에 호이스트되지않는다.
var add = function add(num1,num2){
return num1+num2;
}

오버로딩:
오버로딩은 기본적으로 지원하지 않는다.

this :
this는 호출한 함수의 스코프를 가진다. 따라서 객체내에서 불려진 함수내에서의 this 는 호출한 함수이지만, wrapping 되지 않고 호출되는 함수는 그냥 전역이 this 이다.

call 메쏘드:
this 는 임의로 조작해서 전혀 다른 객체를 this 로 전달할수있는다.
실행한함수또는객체.call(this 또는 다른 객체를 this 로 지정,args);
즉, helloWorld.call(this,"happy"); 라고 하면 helloworld 함수를 호출하되, 함수내에서 this 를 호출하면 전역 this 를 불려지게 하고, happy 라는 인자를 전달한다 라는 것고 같다.
helloWorld.call(anotherWorld,"avatar"); 라고 하면 helloworld 함수내에서 this 는 anotherworld 가 되고, 인자로 아바타를 전달하고 실행한다.

apply 메쏘드:
call 과 같지만, 두번째 인수로 배열,객체등을 전달할수 있다.

bind 메쏘드:
this 를 아예 고정시켜준다.

3.객체의 이해

: 자바스크립트는 객체가 동적이기 때문에 제약이 없지만 이런점 때문에, 다소 소스 정리가 쉽지않고 이해하기가 난해한 부분이있다.
객체는 거의 key : value 식으로 구성된다.

-프로퍼티
.(점) 속성은 자바스크립에서는 언제든지 선언하여 바로 사용할수 있다. 이때 자바스크립트는 객체에 put 이라는 내부 메쏘드를 호출한다. 그리고 값을 할당하면 바로  set 이 호출되어 새로운 값으로 교체한다.
객체에 특정 프로퍼티가 있는지 체크하려면 객체에 속성이 있는지 if( "name" in person);  검증한다. 이때는 프로퍼티의 값을 검증하지는 않고 속성만 판탄하기 때문에 성능향상에 좋다.
다만 객체가 생성될때 기본적으로 자바스크립에서 부가적인 속성을 추가하기 때문에 , 사용자가 만든 고유의 속성인지 확인해 볼필요가 있을때는 .hasOwnProperty("name") 라고 해야 한다.

프로퍼티는 delete 연산자르 삭제해야 한다. 중요하다.

객체의 프로퍼티가 어떤게 있는지 보고 싶을때는
열거가능한 프로퍼티.즉 tostring 따위도 포함할경우  for( property in object) 식
고유의 프로퍼티 (var props = Object.keys(object); for(var i=0;i < props.length;i++))  으로 한다.

-프로퍼티의 종류
Data property 와 Accessor Property 로 나뉜다.
Data propery : put 메쏘드의 기본동작으로 생성된다. 값을 지정한다.
Accessor propety : get set 을 별도로 정의한다.

프로퍼티의 속성은 Object.defienProperty("객체","프로퍼티이름",프로퍼티 서술자)  로 바꿀수 있다.

Data property 는 value, writeable 속성을 추가로 바꿀수있다.

Object.defineProperty(person1,"name",{
value : "v1",
enumerable : true,
configurable:true,
writeable:true});

Data accessor property 는 get , set  을 변경할수 있다.

defienProperties 로 하면 여러개의 프로퍼티를 한번에 할수 있다.

프로퍼티 속성을 가져올때는 Object.getOwnPropertyDescriptor() 를 사용한다.

객체의 수정방지
객체 속성중 Extensible 을 false 로 하면 객체를 수정할수 없다.
Object.preventExtensions() 를 사용하면, 확장불가능한 객체로 만들수 있다.(엄격한 모드)

객체의 봉인
Object.seal()메쏘드를 하면 봉인할수 있다. 추가로 프로퍼티 추가나 제거는 불가능 하지만, 읽기나 쓰기는 가능하다.

객체의 동결
읽기 전용으로 만든다. Object.freeze(); 일종의 객체에 대한 스냅샷을 만든다고 생각하면 된다.

4.생성자와 프로트타입
생성자는 그냥 인자를 이용하면 됨.

프로토타입 
:어떤 함수를 이용하여 여러번 호출할때, 함수안에 정의된 내부함수객체를 별도의 빼내어 낸게 프로토타입이다.
Object.prototype 식으로 하며 ,보통  Object.prototype.myfunc = function(){};
더 나은 방법으로는
Object.prototype = {
whois : Person,
myfunc : function(){},
sayhello : function(){}
};

내장객체의 프로토타입
:내장객체의 프로토타입에 고유의 기능을 추가하면 꽤 유용한 경우가 있다.
Array.prototype.sum = fuction(){ return 1+1); array.sum();

5. 상속
6.객체 패턴
자바스크립트는 모두 public 이다.
따라서 Closure 를 이용해서 private 속성값을 만든다.

0 comments:

댓글 쓰기