자바스크립트의 객체 상수

객체 상수

자바스크립트에는 상수가 없지만 대다수 최신 브라우저 환경에서는 const 문을 통해 상수를 생성할 수 있습니다.

흔히 사용되는 우회적인 방법으로, 명명 규칙을 사용하여 값이 변경되지 말아야 하는 변수명을 모두 대문자로 쓰기도 합니다.

이 규칙은 실제로 자바스크립트 내장 객체에서도 사용됩니다.

javascript

Math.PI; // 3.1415922653589793
Math.SQRT2; // 1.4142135623720951
Number.MAX_VALUE; // 1.7976931348623157e+308

사용자 정의 상수에도 동일한 명명 규칙을 적용하여, 생성자 함수에 스태틱 프로퍼티로 추가할 수 있습니다.

javascript

// 생성자
var Widget = function () {
	// 생성자 구현내용...
};

// 상수
Widget.MAX_HEIGHT = 320;
Widget.MAX_WIDTH = 480;

객체 리터럴로 생성한 객체에도 동일한 명명 규칙을 적용할 수 있습니다.

즉, 대문자로 쓴 일반적인 프로퍼티를 상수로 간주하는 것입니다.

실제로도 값이 변경되지 않게 하고 싶다면, 비공개 프로퍼티를 만든 후, 값을 설정하는 메서드(setter) 없이 값을 반환하는 메서드(getter)만 제공하는 방법도 고려해 볼 만 합니다.

그러나 대부분의 경우에는 단순히 명명 규칙만으로도 충분하기 때문에 이 방법은 좀 과도할 수 있습니다.

이어질 예제는 다음과 같은 메서드를 제공하는 범용 constant 객체를 구현한 것입니다.

• set(name, value) : 새로운 상수를 정의한다.
• isDefined(name) : 특정 이름의 상수가 있는지 확인한다.
• get(name) : 상수의 값을 가져온다.

이 예제에서는 상수 값으로 원시 데이터 타입만 허용됩니다.

또한 선언하려는 상수의 이름이 toString 이나 hasOwnProperty 등 내장 프로퍼티의 이름과 겹치지 않도록 보장하기 위해 hasOwnProperty() 를 사용한 별도의 확인 작업을 거칩니다.

마지막으로 모든 상수의 이름 앞에 임으로 생성된 접두어를 붙입니다.

javascript

var constant = function () {
	
	var constants = {},
	    ownProp   = Object.prototype.hasOwnProperty,
	    allowed   = {
		    string : 1,
		    number : 1,
		    boolean: 1
	    },
	    prefix    = (Math.random() + "_").slice(2);
	
	return {
		set : function (name, value) {
			if (this.isDefined(name)) {
				return false;
			}
			if (!ownProp.call(allowed, typeof value)) {
				return false;
			}
			constants[prefix + name] = value;
			return true;
		},
		isDefined : function (name) {
			return ownProp.call(constants, prefix + name);
		},
		get : function (name) {
			if (this.isDefined(name)) {
				return constants[prefix + name];
			}
			return null;
		}
	}
	
}();

아래에서 테스트 해보도록 합니다.

javascript

// 이미 정의되었는지 확인한다.
console.log(constant.isDefined('maxwidth')); // false 가 기록

// 정의한다.
console.log(constant.set('maxwidth', 480)); // true 가 기록

// 다시 정의를 시도해 본다.
console.log(constant.isDefined('maxwidth')); // true 가 기록

// 값은 그대로인가?
console.log(constant.get('maxwidth')); // 480 이 기록

Jaehee's WebClub