登录  /  注册
博主信息
博文 91
粉丝 0
评论 0
访问量 73392
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
正经人一辈子都用不到的 JavaScript 方法总结 (二)
编程三昧
原创
569人浏览过

前言

现在有这样一个需求:用一个对象存储某学生的各科成绩,要求每次只能改变科目分数,不能再添加或者删除科目。

分析一下,这个需求其实就是需要创建一个固定属性的对象,其属性不可增删,但属性值可更改。

有些同学可能就这么开始了:

  • 首先,定义一个符合要求的对象:

// 声明成绩存储对象let reportObj = {};// 给成绩存储对象添加科目,并设置科目属性不可增删,但科目成绩可修改Object.defineProperties(reportObj, {    ChineseMark: {        enumerable: true,        writable: true,        configurable: false,        value: 60    },    EnglishMark: {        enumerable: true,        writable: true,        configurable: false,        value: 60    }});
  • 然后写入成绩:

// 存入科目成绩reportObj.ChineseMark = 99;reportObj.EnglishMark = 95;console.log(reportObj);  // {ChineseMark: 99, EnglishMark: 95}

删除属性来试试:

delete reportObj.ChineseMark;  // falseconsole.log(reportObj);  // {ChineseMark: 99, EnglishMark: 95}

貌似确实符合条件了,那么再试试增加属性吧:

reportObj.PhysicsMark = 100;console.log(reportObj);  // {ChineseMark: 99, EnglishMark: 95, PhysicsMark: 100}

咋回事,怎么突然就不太符合要求了呢?Object.defineProperties() 只能精确控制所增添的属性的特质,但如果给对象添加属性的话,它就无力控制了。

今天我们就用简单的接口方法来实现一下这幺蛾子需求  ︿( ̄︶ ̄)︿

Object.seal()

描述

seal 如果作动词,那它的解释就是“密封”:

image-20210825210254120

见名知意,Object.seal() 方法就是用来“密封”一个对象的,它阻止对象添加新属性,并将对象所有的现有属性标记为不可配置。当前属性的值只要原来是可写的就可以改变。

作用

通常,一个对象是可扩展的(可以添加新的属性)。

密封一个对象会让这个对象变的不能添加新属性,且所有已有属性会变的不可配置。属性不可配置的效果就是属性变的不可删除,以及一个数据属性不能被重新定义成为访问器属性,或者反之。但属性的值仍然可以修改。

尝试删除一个密封对象的属性或者将某个密封对象的属性从数据属性转换成访问器属性,结果会静默失败或抛出 TypeError(在严格模式 中最常见的,但不唯一)。

const object1 = {    property1: 42};Object.seal(object1);object1.property1 = 33;console.log(object1.property1);// expected output: 33delete object1.property1; // cannot delete when sealedconsole.log(object1.property1);// expected output: 33

总结起来,Object.seal() 其实就是做了以下事情:

  • 设置Object.preventExtension(),禁止添加新属性(绝对存在)

  • 设置configurable为false,禁止配置(绝对存在)

  • 禁止更改访问器属性(getter和setter)

语法

Object.seal(obj)

参数

参数 obj 代表将要被密封的对象。

返回值

被密封的对象。

实现需求

既然有这么好用的方法,那我们当然要好好利用一番啦,终于可以完美实现文章开头的需求了:

// 声明成绩存储对象及其属性let reportObj = {       ChineseMark: 60,    EnglishMark: 60};// 密封成绩对象let sealedReportObj = Object.seal(reportObj);// 更改科目分数sealedReportObj.ChineseMark = 99;sealedReportObj.EnglishMark = 97;console.log(sealedReportObj); // {"ChineseMark": 99, "EnglishMark": 97}

验证一下:

// 增加属性sealedReportObj.PhysicsMark = 100;console.log(sealedReportObj); // {"ChineseMark": 99, "EnglishMark": 97}// 删除属性delete sealedReportObj.ChineseMark; // falseconsole.log(sealedReportObj); // {"ChineseMark": 99, "EnglishMark": 97}

可以看到对象的属性确实是增删不了了,算是简单实现了需求吧。

扩展

如果要判断一个对象是否“密封”,我们可以使用 Object.isSealed() 方法:

Object.isSealed(sealedReportObj); // true

Object.freeze()

看到这里,可能很多同学都想起了 Object.freeze() 方法,它的作用是用来冻结一个对象。实际作用就是字面意思:冻结一个对象,使其属性和属性值都不可更改。用来实现这个需求显然是不合适的。

共同点

Object.seal()Object.freeze() 有以下共同点:

  • 作用的对象变得不可扩展,这意味着不能再添加新属性。

  • 作用的对象中的每个元素都变得不可配置,这意味着不能删除属性。

  • 如果在 ‘use strict’ 模式下使用,这两个方法都可能抛出错误。

不同点

Object.seal() 能让你修改属性的值,但 Object.freeze() 不能。

总结

以上就是关于 Object.seal() 方法的一些简单介绍和应用,以及它和 Object.freeze() 的异同点,希望能对大家有所帮助。

~

~本文完,感谢阅读!


参考文档:

Object.seal()

Object.freeze()

本博文版权归博主所有,转载请注明地址!如有侵权、违法,请联系admin@php.cn举报处理!
全部评论 文明上网理性发言,请遵守新闻评论服务协议
0条评论
作者最新博文
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2024 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • 登录PHP中文网,和优秀的人一起学习!
    全站2000+教程免费学