当前位置: 首页 > news >正文

js 只读对象

文章目录

  • 前言
  • 字符串只读
  • 设置对象属性只读
    • 1、Object.freeze 全部属性
    • 2、Object.defineProperty 指定属性


前言

  • 将对象或者对象属性设置成只读,让其在发生修改时报错,可以更快的定位更改的代码位置;

字符串只读

  • 使用 Object.freeze 冻结字符串是没有效果的,因为字符串赋值会将地址换掉。
const some_str = 'abc';
some_str = 'hello';  // 此行代码报错: Assignment to constant variable.

设置对象属性只读

1、Object.freeze 全部属性

  • 非严格模式时,冻结对象后对象已有的属性不能修改;且不能新增属性;但是对已有属性使用等号赋值和新增属性都不会报错;
  • 如果需要报错则可以使用 Object.defineProperty ;
  • 如果对对象整体重新赋值,冻结效果失效。因为对象的地址换掉了。
let some_obj = {name: 'hello'};
console.log(some_obj); // {  "name": "hello"}
some_obj.name='world';
console.log(some_obj);  // {  "name": "world"} 可以修改属性值
Object.freeze(some_obj)
some_obj.name='freeze world';
console.log(some_obj);  // {  "name": "world"} ; 不能修改属性值
some_obj.age= 18;
console.log(some_obj);  // {  "name": "world"} 没有 age 属性
// Object.defineProperty(some_obj, 'age',{value: 18}); // Cannot define property age, object is not extensible
some_obj = {age: 18};
some_obj.sex = 0;
console.log(some_obj); // {age: 18, sex: 0}
  • 严格模式时:但是对已有属性使用等号赋值和新增属性都会报错; Object.defineProperty 设置属性值也会报错;
  • 如果对对象整体重新赋值,冻结效果失效。
"use strict";
let some_obj = {name: 'hello'};
console.log(some_obj); // {  "name": "hello"}
some_obj.name='world';
console.log(some_obj);  // {  "name": "world"} 可以修改属性值
Object.freeze(some_obj)some_obj.name='freeze world'; // Cannot assign to read only property 'name' of object '#<Object>'
console.log(some_obj);  // {  "name": "world"} ; 不能修改属性值some_obj.age= 18;  //  Cannot add property age, object is not extensible
console.log(some_obj);  // {  "name": "world"} 没有 age 属性
// Object.defineProperty(some_obj, 'age',{value: 18}); // Cannot define property age, object is not extensible
some_obj = {age: 18};
some_obj.sex = 0;
console.log(some_obj); // {age: 18, sex: 0}

2、Object.defineProperty 指定属性

  • 设置对象的某个属性只读;
  • 可以添加新属性,已经存在的旧属性,不能修改属性值。非严格模式时,对其进行赋值也不报错;
  • 如果需要报错使用 Object.defineProperty, 需要注意的是。对应得value 值要进行修改,才会报错,不然也是不报错运行完成。
let some_obj = {name: 'hello'};
console.log(some_obj); // {  "name": "hello"}
some_obj.name='world';
console.log(some_obj);  // {  "name": "world"} 可以修改属性值Object.defineProperty(some_obj, 'name',{value: 'define',enumerable: true,writable: false,configurable: false
});
some_obj.name='freeze world'; 
console.log(some_obj);  // {   "name": "define"} ; 不能修改属性值,也不报错
some_obj.age= 18;  
console.log(some_obj);  // { "name": "define","age": 18 } 可以添加新属性
Object.defineProperty(some_obj, 'sex',{value: 0,enumerable: true,}); 
console.log(some_obj); // { "name": "define",  "age": 18, "sex": 0 } ; 可以添加新属性// Object.defineProperty(some_obj, 'name',{
//     value: 'define-2',
//     enumerable: true,
//     writable: false,
//     configurable: false
// });  //  Cannot redefine property: namesome_obj = {age: 18};
some_obj.sex = 0;
console.log(some_obj); // {age: 18, sex: 0}
  • 严格模式时:
  • 对只读属性进行赋值会报错;
  • 严格模式时,使用 Object.defineProperty,对应得value 值也需要进行修改,才会报错,不然也是不报错运行完成。
"use strict";
let some_obj = {name: 'hello'};
console.log(some_obj); // {  "name": "hello"}
some_obj.name='world';
console.log(some_obj);  // {  "name": "world"} 可以修改属性值Object.defineProperty(some_obj, 'name',{value: 'define',enumerable: true,writable: false,configurable: false
});
// some_obj.name='freeze world'; // Cannot assign to read only property 'name' of object '#<Object>'
console.log(some_obj);  // {   "name": "define"} 
some_obj.age= 18;  
console.log(some_obj);  // { "name": "define","age": 18 } 可以添加新属性
Object.defineProperty(some_obj, 'sex',{value: 0,enumerable: true,}); 
console.log(some_obj); // { "name": "define",  "age": 18, "sex": 0 } ; 可以添加新属性// Object.defineProperty(some_obj, 'name',{ value: 'define-2', });  //  Cannot redefine property: namesome_obj = {age: 18};
some_obj.sex = 0;
console.log(some_obj); // {age: 18, sex: 0}

相关文章:

  • 北京网站建设多少钱?
  • 辽宁网页制作哪家好_网站建设
  • 高端品牌网站建设_汉中网站制作
  • CSRF+XSS组合攻击实战
  • MySQL1.试建产品库
  • 网友提问:display:flex和display:box有什么区别?
  • k8s核心操作_存储抽象_K8S中使用Secret功能来存储密码_使用免密拉取镜像_k8s核心实战总结---分布式云原生部署架构搭建033
  • Android 记录锁屏的上层相关源码以及debug WindowManager
  • 大数据环境下的房地产数据分析与预测研究的设计与实现
  • 5 webSocket
  • 1个Xpath定位可以在Web页面查找到多个元素Selenium
  • Nginx部署前端项目尝试 - windows版
  • git commit报错: pre-commit hook failed (add --no-verify to bypass)
  • ceph log内容解析
  • 针对【module_or_function】的单元测试,全面覆盖可能的【edge_cases】
  • 云计算实训10——frp服务的搭建、ftp服务的搭建
  • Elasticsearch 使用terms对long类型日期统计按月销售
  • 1、springboot3 vue3开发平台-后端-项目构建
  • avalon2.2的VM生成过程
  • httpie使用详解
  • Linux快速复制或删除大量小文件
  • miaov-React 最佳入门
  • MQ框架的比较
  • PyCharm搭建GO开发环境(GO语言学习第1课)
  • Python 使用 Tornado 框架实现 WebHook 自动部署 Git 项目
  • Spark RDD学习: aggregate函数
  • windows下如何用phpstorm同步测试服务器
  • 搭建gitbook 和 访问权限认证
  • 大整数乘法-表格法
  • 蓝海存储开关机注意事项总结
  • 如何选择开源的机器学习框架?
  • 应用生命周期终极 DevOps 工具包
  • JavaScript 新语法详解:Class 的私有属性与私有方法 ...
  • # Spring Cloud Alibaba Nacos_配置中心与服务发现(四)
  • #HarmonyOS:基础语法
  • (LLM) 很笨
  • (windows2012共享文件夹和防火墙设置
  • (论文阅读32/100)Flowing convnets for human pose estimation in videos
  • (提供数据集下载)基于大语言模型LangChain与ChatGLM3-6B本地知识库调优:数据集优化、参数调整、Prompt提示词优化实战
  • (万字长文)Spring的核心知识尽揽其中
  • (转)IIS6 ASP 0251超过响应缓冲区限制错误的解决方法
  • ../depcomp: line 571: exec: g++: not found
  • .ai域名是什么后缀?
  • .describe() python_Python-Win32com-Excel
  • .NET 8.0 中有哪些新的变化?
  • .NET C# 操作Neo4j图数据库
  • .NET Core 和 .NET Framework 中的 MEF2
  • .net framework 4.8 开发windows系统服务
  • .net(C#)中String.Format如何使用
  • .NET/C# 获取一个正在运行的进程的命令行参数
  • :class的用法及应用
  • @kafkalistener消费不到消息_消息队列对战之RabbitMq 大战 kafka
  • @modelattribute注解用postman测试怎么传参_接口测试之问题挖掘
  • [ 2222 ]http://e.eqxiu.com/s/wJMf15Ku
  • []FET-430SIM508 研究日志 11.3.31
  • [AI Google] Ask Photos: 使用Gemini搜索照片的新方法
  • [APUE]进程关系(下)
  • [bzoj1324]Exca王者之剑_最小割