변수
자바스크립트 변수에 대해서 알아보자
데이터 타입
숫자
자바스크립트 에서는 정수와 실수값을 구분하지 않고 모두 64비트의 실수로 표현한다.
배열 인덱싱과 비트 연산과 같은 특정연산은 32비트 정수로 수행한다.
표현이 가능한 범위를 벗어난 숫자는 (+/-)Infinity 로 표현된다.
또한 오버플로우, 언터플로우, 0 에 관한 별도의 에러를 발생시키지 않는다.
0을 0으로 나누는 연산은 정의된 값으로 표현할 수가 없기에 'NaN' 이라는 키워드로 표현된다.
문자
딱히 정리할 필요는 없어 보인다.
'\' 를 활용하여 문자열 사이에 특별히 표한하고자 하는 문자를 삽입할 수 있다.
정규표현식
RegExp() 생성자라는 것을 통해서 문자열을 검증할 수 있다.
에초에 정규표현식은 가독성이 지나치게 떨어지기 떄문에 본인은 주로 정규표현식 검증 해당 사이트를 활용한다.
null : 값이 없다.
undefined : 초기화 되지 않은 변수나 기타요소에 접근하려 할때 발생되는 일종의 전역 프로퍼티
묵시적, 명시적 타입의 형변환
자바스크립트는 비교적 형변환에 대해서 유연하다.
그러나 자바스크립트의 이와 같은 특성 때문에 골치를 썩었던 경험을 남기고자 한다.
명시적으로 간단한 형변환을 취해 별도의 wrapper 객체를 활용하는 것보다
간편하게 숫자형태로 형변환을 가미했으나, 앞서 말한 특정 연산자는 32비트 이내로
표현이 가능하기 때문에 명시적인 형변환이라고 하더라도 안심해서는 안된다.
객체
복합적인 요소를 가지고 있는 값으로 생각하면된다.
프로퍼티 혹은 명명되어 있는 값들의 집합을 의미한다.
내부요소는 '.' 을 통하여 참조가 가능하다.
문자열 리터럴은 객체가 아니지만 내부적으로 객체로 변환되기 때문에 해당 객체에 정의된 문자열과 관련된 요소를 참조할 수 있다.
var s = "hello word"; s.substring(3,4);숫자와, 불리언도 위와 비슷한 이유로 필요한 메서드를 별도의 선언없이 참조할 수 있다.
위와 같은 기본 리터럴들의 객체를 wrapper 객체라고 한다.
wrapper 에는 참조만 가능하고, 할당은 불가하기에 유의한다.
객체는 mutable 과 같은 특성을 가지고 있고 간단하게 이야기하여 자신의 값을 변경이 가능하다.
값으로 비교되지 않으며 참조에 의하여 비교가 되므로 객체 내부의 특정 값과 비교하려면 '===' 과 같은 연산자, 혹은 비교 함수를 선언하여 비교한다.
객체에서 원시타입 변환시 특이케이스 정리
객체를 문자열로 변환시 흐름
객체가 toString() 메서드를 통하여 반환하는 값이 원시 타입의 값이 아니라면, valueOf() 메서드의 호출과정으로 원시 타입값을 확인하려하고, 둘다 없는 경우 TypeError 을 발생시킨다.
객체를 숫자로 변환시 흐름
위의 문자열로 변환시 흐름과 반대로 valueOf() -> toString() -> TypeError 과정을 거친다.
빈 배열을 이외 같은 경우 때문에 0 으로 반환되곤 한다. 배열은 기본적으로 valueOf() 를 상속한다.
또한 배열의 숫자형태 변환은 toString() 메서드에 의존한다.
배열은 때문에 다음과 같은 과정이 일어난다.
[] -> "" -> 0
[3] -> "3" -> 3
전역 객체
자바스크립트 전역에서 사용하도록 정의된 심벌이다.
인터프리터가 기동될 떄, 새로운 웹페이지가 로딩될 때 여러 내부에 정의된 프로퍼티들을 초기화한다.
undefined, Infinity, Nan 등은 전역 객체 내부에 있고 엄밀히 이야기해서 예약어는 아니지만, 동일하게 취급된다.
객체는 객체가 가진 고유한 프로퍼티를 유지하는 것 외에 프로토타입(Proto Type)이라 불리우는 최상위 Object의 프로퍼티를 상속받는다.
또한 프로퍼티는 동적으로 추가 및 제거가 가능하다.
여기서 말하는 프로퍼티는 key/value 형식에 존재하는 객체 내의 집합을 의미한다.
프로퍼티 속성(property attribute)
ES5 부터는 사용자가 생성한 프로퍼티의 속성만을 변경이 가능하다.
writable : 프로퍼티의 값의 수정 여부를 결정
enumerable : 프로퍼티의 이름을 for/in 구문에서 읽을 수 있는지 결정
configurable : 프로퍼티의 삭제/변경 가능 여부
오브젝트 속성(object attribute)
prototype : 상속받은 프로퍼티들에 대한 객체를 참조한다.
class : 객체의 자표형을 특정.
extensible : 새로운 프로퍼티를 추가할 수 있는지 여부
오브젝트
네이티브 오브젝트 : 이미 선언되어있는 객체들의 클래스 (배열, 정규표현식, 날짜 등등)
호스트 오브젝트 : 브라우저 및 자바스크립트 인터프리터가 내장된 호스트의 환경에 정의된 객
사용자정의 오브젝트 : 사용자가 작성한 코드에 의해 생성된 객체
프로퍼티
고유 프로퍼티 : 객체에 직접 정의된 프로퍼티
상속된 프로퍼티 : 해당 객체의 프로토타입 객체가 정의한 프로퍼티를 의미
객체의 생성방식
객체 리터럴을 통한 방식
var myObject = {}; var myObject2 = {kbh : 32};new 키워드 활용
var myObjectCreateByConstructor = new Object(); var myObjectCreateByConstructor = new RegExp("js");Object.create()
이해하기에 앞서 프로토타입이 무엇인가 잠시 훑어보고 넘어간다.
대상이 되는 객체에 프로퍼티들을 제공해주는 객체를 의미한다.
객체 리터럴 '{}' 로 선언된 모든 객체의 프로토타입은 같다.
모든 프로토타입의 최상위는 Object 이며, 각 객체별로 프로토타입들이 연결된 구조를
프로토 타입 체인이라고 정의한다.
다음을 살펴본다. Object.create에 {1} 에 인자값으로 프로토타입을 주입하여
넣는게 가능하며, {2}에 인자값으로 프로퍼티 속성을 주입할 수 있다.
{1} 인자에 생략도 가능하지만, 이럴경우 최상의 Object에 선언된 기본적인 메서드 사용불가 및
연산자 조차 사용이 불가능하다.
var myObjectCreateByInjectPrototypeArgument = Object.create({1},{2});특정한 프로토타입을 상속 받도록 메서드를 통해 금지 시킬 수 있으나, 내 개발 업무 내의 ES5 기준으로 이런 코드를 작성할 일이 없기 때문에, 생략한다.
Object의 프로퍼티에 접근하는 방법은 다음 두가지
var myObject = {x : 1}; console.log(myObject['x']); console.log(myObject.x);두 표현식은 동일하다. 위의 배열 형식으로 접근하기 위해 기술된 배열을 연관 배열(associate array) 이라 명명되기도 하고 hash, map, dictionary 라고도 한다. 모든 오브젝트는 연관 배열이다.
타 언어는 정해진 수의 프로퍼티를 가져야 하고 반드시 프로퍼티의 이름을 미리 정의 해두어야하나 자바스크립트에서는 타입이 제약이 느슨하기 때문에 이런 규칙이 적용되지 않는다.
프로퍼티의 이름을 반드시 식별자로 표현해야하며, 작성자가 직접 만든 이름이르모 자료형이 존재하지 않기에 프로그램 실행되는 도중에 변경이 불가하다.
하지만 연관 배열을 사용해 객체의 프로퍼티에 접근시에는 식별자가 문자열이기 떄문에 프로그램 실행 도중 생성하고 접근이 가능하다. 무슨 소리이인지는 다음의 코드를 보면 알 수 있다.
var addr = ""; //가상의 customer 에 addr1, addr2 .... 등으로 이루어진 프로퍼티가 있다고 가정해보자 for (i = 0; i < 4; i++){ addr += customer["addr" + i] // 와 같은 형식으로 유동적인 접근이 가능하다. }
프로퍼티 삭제
delete 키워드를 사용하면 되며, 이때 대상 객체의 고유한 프로퍼티가 아니라고 하면 삭제하지 않기 때문에 주의한다.
대상 오브젝트의 프로퍼티 속성중 configurable 속성이 'false'인 경우 삭제 불가
nonextensible 객체에 속한 configurable 속성이 'true'인 경우 삭제가 가능
프로퍼티 검사
in, hasOwnProperty(), propertyIsEnumerable(), 직접 접근하는 방식 등으로 검사가 가능하다.
propertyIsEnumerable() 의 경우에는 고유한 프로퍼티가 존재하고, Enumerable 속성이 true 인 경우에만 true 값을 반환한다.
프로퍼티 열거하기
객체의 모든 프로퍼티를 특정한 순회가 필요할 경우 사용 방법이 존재한다.
for/in 방식으로 순회하기
고유 프로퍼티만 반환하는 것이 아니기 때문에 별도의 작업이 필요하다.
Object.keys() 함수를 사용하기
열거가 가능한(Enumerable)한 프로퍼티의 이름을 배열형태로 반환한다.
Object.getOwnPropertyNames() 함수 사용하기
해당 객체의 모든 고유 프로퍼티의 이름을 반환한다.
프로퍼티 getter/ setter
프로퍼티에 대한 접근자 프로퍼티(accessor property) 라고 할 수있다.
타 프로퍼티와 다르게 키/값 형식으로 작성하지 않고 각각의 키워드와 함수가 같이 작성된다.
솔직히 말해서 결론적으로는 안쓸거 같다.
getter()
객체의 접근자 프로퍼티의 값에 접근 시, 자바스크립트 엔진은 getter()에 인자 값을 포함하지 않고 호출한다.
getter()의 반환 값이 프로퍼티 접근 표현식의 값이 된다.
writable 속성을 가진다.
setter()
반대로 setter()는 프로퍼티의 값을 변경하고자 할때, 자바스크립트 엔진이 호출한다.
getter()와 다르게 아무런 속성을 가지지 않는다 반환값이 무시되기 떄문인듯 하다.
정확히는 undefined 가 반환된다.
프로퍼티 속성
ES5에서 js 라이브러리를 만드려고 할 시에 알아야할 API 들의 소개가 될 것이다.
이 목차에서는 getter/setter 메서드를 프로퍼티가 가진 속성으로 간주하였고,
이러한 방식으로 생각하면 데이터 프로퍼티의 값도 속성이라고 이야기한다.
접근자 프로퍼티는 value, writable 속성이 없다. 그러나 writable 속성은 setter 메서드의 존재 여부에 따라서 결정이 된다. 그래서 위와 같은 서론을 통해서 아래와 같이 프로퍼티 속성의 종류를 정한다.
데이터 프로퍼티 속성
value, writable, enumerable, configurable
접근자 프로퍼티 속성
get, set, enumerable, configurable
위를 표한하기 위하여 property descriptor 라는 특수한 객체를 사용한다.
이 객체의 프로퍼티 이름은 표현하고자하는 대상의 속성의 이름과 같고 getOwnPropertyDescriptor()를 통해 얻을수 있다. 상속받은 프로퍼티의 속성에 대한 검증은 프로토타입 체인을 명기적으로 순회해야한다. 이 부분(getPrototypeOf)에 대해서는 별도의 스터디의 목차에서 다룬다.
getter/setter 를 제외하고 모두 boolean 값만 가지고있다.
직접 프로퍼티의 속성을 정하고자 할때 Object.defineProperty() 를 이용하는 것도 하나의 방법이다.
인자 값으로 프로퍼티 디스크립터 객체는 유동적으로 정의가 가능하다. (항상 풀세트로 정의하지 않아도 된다.)
프로퍼티 디스크립터 객체에 속성이 지정되어 있지 않으면 그대로 유지된다.
주의점은 상속받은 프로퍼티의 속성을 바꾸지 않으니 주의한다.
여러 프로퍼티를 만들거나 수정이 필요한 경우, Object.defineProperties()를 활용한다.
또한 nonextensible 속성을 가진 객체에 위 메서드로 프로퍼티의 변경을 가미시 TypeError 이 발생한다.
이외도 주의 점이 참 많기때문에 '자바스크립트 완벽가이드 p166~167'을 참고한다.
이외에도 기타 요소 속성들이 많다. '자바스크립트 완벽가이드 p167~172' 를 참고하자
객체 직렬화 하기
JSON.stringfy()/ JSON.parse() 각각 객체 <--> 직렬화 역활을 담당한다.
표현이 불가능한 값들은 null로 표기된다.
인자값으로 가공하고자하는 프로퍼티의 목록을 지정할 수 있다.
자세한건 '자바스크립트 완벽가이드 후반부 레퍼런스' 참고
객체 메서드
어느 객체에서나 사용이 가능하도록 한 메서드들 이며, Object.prototype 의 프로퍼티를 상속받는다.
toString() : 각 객체들이 정의한 고유한 결과 값을 반환한다. 특별히 없는 경우에는 [object Object]를 반환한다.
toLocaleString() : 지역화(localize) 된 정보를 반환하는 것이 목적, 특별히 이 메서드를 정의한 객체가 아니라면 toString과 동일하게 작동한다.
toJSON() : 다른 메서드들과 다르게 Object.protoType 에 정의 되있지 않으나, JSON.stringfy() 는 이 메서드가 있는 경우 원래 객체 대신 이 메서드의 결과 값을 직렬화 한다.
valueOf() : 원시타입으로 변환용도로 쓰이고, 원시타입이 활용되어야하는 문맥에서 호출 과정이 이루어 진다.
Last updated
Was this helpful?