이 글에서는 특정 참고 가치가 있는 JavaScript 객체 재작성을 금지하는 방법을 주로 소개합니다. 이제 필요한 친구들이 참고할 수 있습니다.
번역기 보도자료: JavaScript 객체 재작성을 방지하려면 Object.preventExtensions(), Object.seal() 및 Object.freeze()를 사용하세요.
번역자: Fundebug
원문: JavaScript 객체 수정 방지
#🎜🎜 #overridesome object(object) 정의할 수 있습니다. 즉, 누구나 우리가 정의한 객체를 재정의할 수 있습니다. 이는 많은 개발자가 특정 개체의 동작을 확장하거나 수정하려는 데 관심을 갖는 매우 강력한 기능입니다. 예를 들어 DOM 메서드 document.getElementById()를 재정의할 수 있습니다. 일반적으로 말해서, 이렇게 하면 코드를 유지 관리하기가 어려워지고 찾기 어려운 일부 버그가 남게 되므로 이 작업을 피해야 합니다. ECMAScript 5에는 개발자가 객체 재작성을 제한할 수 있는 방법이 도입되었습니다. jQuery, fundebug 등과 같은 일부 도구 라이브러리를 개발 중이거나 개발 팀의 규모가 매우 큰 경우 이 기사에서 소개된 방법이 매우 유용할 것입니다.
다른 사람의 개체를 재정의하지 마세요 다른 사람의 개체를 재정의하지 마세요. 이것이 JavaScript의 황금률입니다. 예를 들어 메서드를 재정의하면 해당 메서드에 의존하는 라이브러리에 영향을 미칠 수 있어 다른 개발자에게 매우 혼란스러울 수 있습니다.
// 示例代码1
window.originalAlert = window.alert;
window.alert = function(msg) {
if (typeof msg === "string") {
return console.log(msg);
}
return window.originalAlert(msg);
};
alert('ooh so awesome'); // 参数为字符串时，打印到控制台
alert(3.14); // 参数为其他类型时，弹出对话框Sample Code 1에서 windows.alert를 수정했습니다. 매개변수가 문자열이면 콘솔에 인쇄되고, 매개변수가 다른 유형이면 대화 상자가 표시됩니다. 가 나타납니다. 이러한 수정은 분명히 경고 방법을 사용하는 다른 개발자에게 영향을 미칠 것입니다. getElementById()와 같은 DOM 객체를 수정하면 매우 심각한 결과를 초래할 수 있습니다.
객체에 새 메서드를 추가하는 경우에도 문제가 발생할 수 있습니다.// 示例代码2
Math.cube = function(n) {
return Math.pow(n, 3);
};
console.log(Math.cube(2)); // 8| #🎜🎜 #It 속성 추가 금지 | 속성 삭제 금지 | 속성 수정 금지 | |
|---|---|---|---|
| No | No | #🎜🎜 # | Object.seal() |
| 예 | 아니요 | # 🎜🎜#Object.freeze( ) | is |
| is | #🎜🎜 #Object.preventExtensions()使用Object.preventExtensions()，可以禁止给对象添加新的方法或者属性。注意，修改或者删除对象已经存在的方法或者属性是没有问题的。使用Object.isExtensible()可以查看某个对象是否可以增加方法或者属性。 // 示例代码3
var song = {
title: 'Hope Leaves',
artist: 'Opeth'
};
console.log(Object.isExtensible(song)); //true
Object.preventExtensions(song);
console.log(Object.isExtensible(song)); //false
song.album = 'Damnation';
console.log(song.album); // undefined
song.play = function() {
console.log('ahh soo awesome');
};
song.play(); // TypeError: song.play is not a function로그인 후 복사 由示例代码3可知，执行Object.preventExtensions()之后，为song对象新增album以及play方法都失败了！ 但是，当我们为song新增属性或者方法时，并没有报错。当我们使用了"use strict"采用严格模式时，情况就不一样了： // 示例代码4
"use strict";
var song = {
title: 'Hope Leaves',
artist: 'Opeth'
};
Object.preventExtensions(song);
song.album = 'Damnation'; // Uncaught TypeError: Cannot add property album, object is not extensible로그인 후 복사 在严格模式下，给已经Object.preventExtensions的对象新增属性时，会立即报错。广告：如果你希望实时监控应用中类似的错误，欢迎免费试用Fundebug。 Object.seal()使用Object.seal()，可以禁止给对象添加属性或者方法(这一点与Object.preventExtension()的作用一致)，同时禁止删除对象已经存在的属性或者方法。 // 示例代码5
"use strict"
var song = {
title: 'Hope Leaves',
artist: 'Opeth'
};
Object.seal(song);
console.log(Object.isExtensible(song)); //false
console.log(Object.isSealed(song)); //true
song.album = 'Damnation'; // Uncaught TypeError: Cannot add property album, object is not extensible
delete song.artist; // Uncaught TypeError: Cannot delete property 'artist' of #<Object>로그인 후 복사 Object.freeze()使用Object.freeze()，可以禁止为对象增加属性或者方法(这一点与Object.preventExtension()的作用一致)，同时禁止删除对象已经存在的属性或者方法（这一点与Object.seal()的作用一致），另外还禁止修改已经存在的属性或者方法。 // 示例代码6
"use strict"
var song = {
title: 'Hope Leaves',
artist: 'Opeth',
getLongTitle: function()
{
return this.artist + " - " + this.title;
}
};
Object.freeze(song);
console.log(Object.isExtensible(song)); // false
console.log(Object.isSealed(song)); // true
console.log(Object.isFrozen(song)); // true
song.album = 'Damnation'; // Uncaught TypeError: Cannot add property album, object is not extensible
delete song.artist; // Uncaught TypeError: Cannot delete property 'artist' of #<Object>
song.getLongTitle = function() // Uncaught TypeError: Cannot assign to read only property 'getLongTitle' of object '#<Object>'
{
return "foobar";
};로그인 후 복사 主流浏览器的最新版本都支持这些方法：
以上就是本文的全部内容，希望对大家的学习有所帮助，更多相关内容请关注PHP中文网！ 相关推荐： |
위 내용은 JavaScript 객체 재작성을 비활성화하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
