Object.defineProperty() , Object.defineProperties()

• Object.defineProperty() 
• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty

• https://msdn.microsoft.com/library/dd548687(v=vs.94).aspx

• Object.defineProperties()
• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperties
• https://msdn.microsoft.com/library/ff800817(v=vs.94).aspx

---

간단설명 객체의 프로퍼티를 설정한다.
물론 obj.p = “x” 처럼 할 수 있는데.
위 메소드를 사용하면 상세 설정이 가능. readOnly, 커스터마이즈된 get 과 set 등등

---

• ECNAScript 5.1부터 지원.
• IE는 8에서 부분 지원, 9부터 정식 지원

---

Object.defineProperty(obj, prop, descriptor)

기본 설정 및 설명

descriptor = { configurable:flase, //true일 경우 프로퍼티 삭제(delete obj.prop) 가능, writable 설정 변경 가능 enumerable:false, //true일 경우 for(var x in obj) 에서 프로퍼티로 보임 value:undefined, //기본값 설정. get,set 과 같이 사용 불가. writable:false, //값 수정 가능 여부.  get,set 과 같이 사용 불가. get:undefined, //obj.prop 에서 값을 가져올 때 동작. value,writable 과 같이 사용 불가 set:undefined, //obj.prop 에 값을 넣을 때 동작. value,writable 과 같이 사용 불가 }

---

예제 1

var o = {}; (function(o){ var _name = “”; Object.defineProperty(o, ‘name’, {

	get:function(){ return _name; },
	set:function(wcb){
			return function(newValue){ 
				return _name = newValue+"_new";
		}
	}(o),
	//value:"init", //기본값 (get,set 과 같이 사용불가)
	//writable: true, //값 수정 가능여부 (get,set 과 같이 사용불가)
	enumerable: true, //목록 열거시 표시여부
	configurable: true //삭제 가능여부. writable 속성 변경 가능 여부
}); })(o); o.x = "xVal" o.y = "yVal"

console.log(o.name); //기본값 _name의 값인  ”“가 나와야함. //=> “” o.name = “111”; //set 111_new 가 될 것으로 예상. console.log(o.name); //get 111_new 를 출력 //=> 111_new for(var x in o){ console.log(x) } //=> name,x,y delete o.name //삭제시도. //=> true console.log(o.name); //삭제 안되고 값니 나와야함. //=> undefined

for(var x in o){ //삭제되어서 사라짐 console.log(x) } //=> x,y

---

예제2

var o = {}; (function(o){ var _name = “”; Object.defineProperty(o, ‘name’, { value:”init”, //기본값 (get,set 과 같이 사용불가) writable: false, //값 수정 가능여부 (get,set 과 같이 사용불가) enumerable: false, //목록 열거시 표시여부 //configurable: false //삭제 가능여부. writable 속성 변경 가능 여부 }); })(o); o.x = “xVal” o.y = “yVal”

console.log(o.name); //기본값 undefined가 나와야함. //=> init o.name = “111”; //값이 수정 안되야함. (writable: false 효과) console.log(o.name); //init 를 출력 //=> init

for(var x in o){ console.log(x) } //=> x,y //name은 출력 안됨. (enumerable: false 효과)

---

input.value 를 재정의 하는 경우 https://stackoverflow.com/questions/42427606/event-when-input-value-is-changed-by-javascript

			descriptor.set = function(val) {
				
				//changing to native setter to prevent the loop while setting the value
				Object.defineProperty(this, "value", {set:inputSetter});
				this.value = val;
				
				//Custom code triggered when $input.value is set
				console.log("Value set: "+val);
				
				//changing back to custom setter
				Object.defineProperty(this, "value", descriptor);   
				$(this.parentNode).attr("data-val",val);
			}
			
			//Last add the new "value" descriptor to the $input element
			Object.defineProperty(el, "value", descriptor);

---

🔗original-link