동결과 밀봉의 차이
방금 자바스크립트 방법에 대해 들었습니다.freeze
그리고.seal
, 모든 개체를 불변으로 만드는 데 사용할 수 있습니다.
사용 방법에 대한 간단한 예는 다음과 같습니다.
var o1 = {}, o2 = {};
Object.freeze(o2);
o1["a"] = "worked";
o2["a"] = "worked";
alert(o1["a"]); //prints "worked"
alert(o2["a"]); //prints "undefined"
사이의 차이점은 무엇입니까?freeze
그리고.seal
? 성능을 향상시킬 수 있습니까?
- 밀봉된 객체에서 속성을 추가하거나 제거하는 것을 방지합니다.
delete
거짓으로 돌아올 것입니다 - 기존의 모든 속성을 구성할 수 없도록 합니다. 즉, '데이터 설명자'에서 '액세스 또는 설명자'로 변환할 수 없으며(또는 그 반대의 경우), 액세스 또는 설명자의 속성을 전혀 수정할 수 없습니다(데이터 설명자는 변경할 수 있음).
writable
속성, 그리고 그들의value
속성:writeable
true)입니다. - 던질 수 있습니다.
TypeError
밀봉된 객체 자체의 값을 수정하려고 할 때(가장 일반적으로 엄격한 모드에서)
- 정확히 무엇.
Object.seal
실행합니다. - 기존 속성을 수정할 수 없습니다.
어느 쪽도 '깊이'/손주 개체에 영향을 주지 않습니다.예를 들어, 만일obj
냉동상태이고,obj.el
재할당할 수는 없지만, 값은obj.el
예를 들어 수정할 수 있습니다.obj.el.id
변경 가능합니다.
성능:
개체를 밀봉하거나 동결하면 브라우저에 따라 개체의 열거 속도에 영향을 줄 수 있습니다.
- Firefox: 열거 성능에 영향을 주지 않음
- IE: 열거 성능에 미치는 영향은 미미합니다.
- Chrome: 밀봉 또는 동결된 개체를 사용할 경우 열거 성능이 더 빠릅니다.
- Safari: 밀봉 또는 동결된 개체 수가 92% 더 느림(2014년 기준)
이 세 가지 방법을 비교하는 테스트 프로젝트를 작성했습니다.
Object.freeze()
Object.seal()
Object.preventExtensions()
장치 테스트에서는 CRUD 사례를 다룹니다.
- [C] 새 재산을 추가합니다.
- [R] 존재하는 재산을 읽다
- [U] 기존 속성을 수정합니다.
- [D] 존재하던 재산을 없애다
결과:
MDN에서 언제든지 검색할 수 있습니다. 간단히 말해:
- Freeze: 개체가 개체가 아닌 한, 정의된 속성을 변경할 수 없음을 의미하는 개체를 불변으로 만듭니다.
- Seal(씰): 속성 추가를 방지합니다. 그러나 정의된 속성은 여전히 변경할 수 있습니다.
아래 기능들을 비교하고 이 기능들의 차이점을 설명하기 위해 간단한 표를 만들었습니다.
Object.freeze()
Object.seal()
Object.preventExtensions()
Object.freeze()
기존 객체를 가져와 기본적으로 호출하는 동결 객체를 만듭니다.Object.seal()
여기에 모든 "데이터 액세스자" 속성을 다음과 같이 표시합니다.writable:false
할 수 하기 입니다 , 이 입니다 의 입니다 의 이
-- Kyle Simpson, You Don't Know JS - This & Object 프로토타입
ECMA스크립트 5에서 Freeze와 Seal의 차이점을 살펴보고 차이점을 명확히 하기 위해 스크립트를 만들었습니다.Frozen은 데이터와 구조를 포함한 불변 개체를 만듭니다.Seal은 지정된 인터페이스의 변경을 방지합니다(추가, 삭제 없음). 그러나 개체를 변형하고 인터페이스의 의미를 다시 정의할 수 있습니다.
function run()
{
var myObject = function()
{
this.test = "testing";
}
//***************************SETUP****************************
var frozenObj = new myObject();
var sealedObj = new myObject();
var allFrozen = Object.freeze(frozenObj);
var allSealed = Object.seal(sealedObj);
alert("frozenObj of myObject type now frozen - Property test= " + frozenObj.test);
alert("sealedObj of myObject type now frozen - Property test= " + sealedObj.test);
//***************************FROZEN****************************
frozenObj.addedProperty = "added Property"; //ignores add
alert("Frozen addedProperty= " + frozenObj.addedProperty);
delete frozenObj.test; //ignores delete
alert("Frozen so deleted property still exists= " + frozenObj.test);
frozenObj.test = "Howdy"; //ignores update
alert("Frozen ignores update to value= " + frozenObj.test);
frozenObj.test = function() { return "function"; } //ignores
alert("Frozen so ignores redefinition of value= " + frozenObj.test);
alert("Is frozen " + Object.isFrozen(frozenObj));
alert("Is sealed " + Object.isSealed(frozenObj));
alert("Is extensible " + Object.isExtensible(frozenObj));
alert("Cannot unfreeze");
alert("result of freeze same as the original object: " + (frozenObj === allFrozen).toString());
alert("Date.now = " + Date.now());
//***************************SEALED****************************
sealedObj.addedProperty = "added Property"; //ignores add
alert("Sealed addedProperty= " + sealedObj.addedProperty);
sealedObj.test = "Howdy"; //allows update
alert("Sealed allows update to value unlike frozen= " + sealedObj.test);
sealedObj.test = function() { return "function"; } //allows
alert("Sealed allows redefinition of value unlike frozen= " + sealedObj.test);
delete sealedObj.test; //ignores delete
alert("Sealed so deleted property still exists= " + sealedObj.test);
alert("Is frozen " + Object.isFrozen(sealedObj));
alert("Is sealed " + Object.isSealed(sealedObj));
alert("Is extensible " + Object.isExtensible(sealedObj));
alert("Cannot unseal");
alert("result of seal same as the original object: " + (sealedObj === allSealed).toString());
alert("Date.now = " + Date.now());
}
조금 늦을 수도 있겠지만,
- 유사성: 두 개체 모두 확장할 수 없는 개체를 만드는 데 사용됩니다.
- Difference : Freeze configurable에서 개체의 열거 가능 속성과 쓰기 가능 속성을 다음과 같이 설정합니다.
false
. Sealed writeable 속성이 다음과 같이 설정되어 있습니다.true
나머지 속성들은 거짓입니다.
이제 전체 개체를 동결하는 대신 단일 개체 속성을 강제로 동결할 수 있습니다.다음을 통해 이를 달성할 수 있습니다.Object.defineProperty
와 함께writable: false
매개 변수로서
var obj = {
"first": 1,
"second": 2,
"third": 3
};
Object.defineProperty(obj, "first", {
writable: false,
value: 99
});
예제에서는 에서,obj.first
이제 값이 99로 고정되어 있습니다.
저는 이에 대해 오픈 소스 전자책에 썼습니다.개체 제한에 대한 섹션이 있습니다. https://github.com/carltheperson/advanced-js-objects/blob/main/chapters/chapter-3.md#object-restrictions
요약하자면:
다음 표는 제한 계층을 보여 줍니다.
Object.preventExtensions
실패 예
const obj = { a: "A", b: "B" }
Object.preventExtensions(obj)
obj.c = "C" // Failure
console.log(obj) // { a: "A", b: "B" }
Object.seal
실패 예
const obj = { a: "A", b: "B" }
Object.seal(obj)
delete obj.a // Failure
obj.c = "C" // Failure
console.log(obj) // { a: "A", b: "B" }
Object.freeze
실패 예
const obj = { a: "A", b: "B" }
Object.freeze(obj)
delete obj.a // Failure
obj.b = "B2" // Failure
obj.c = "C" // Failure
console.log(obj) // { a: "A", b: "B" }
참고: 코드가 엄격한 모드에서 실행되는지 여부에 따라 "실패" 여부가 달라집니다.
- 엄격모드 = 오류
- 엄격한 모드가 아님 = 무음 실패
언급URL : https://stackoverflow.com/questions/21402108/difference-between-freeze-and-seal
'programing' 카테고리의 다른 글
HRESULT의 예외: 0x80131047 (0) | 2023.09.10 |
---|---|
CSS를 사용하여 글꼴 .ttf를 포함하는 방법? (0) | 2023.09.10 |
를 공략할 수 ?를 공략할 수 ?를 공략할 수 ?CSS로?CSS로?CSS로? (0) | 2023.09.10 |
문자 포인터에 malloc을 사용할 때 (0) | 2023.09.10 |
8.4.0으로 버전 충돌 업데이트 (0) | 2023.09.10 |