当前位置:网站首页>用ES5的方式实现const
用ES5的方式实现const
2022-06-25 22:09:00 【wen_文文】
ES5中的两种属性类型:数据属性和访问器属性;
数据属性:包含一个数据值的位置,在这个位置可以读取和写入值;有4个描述其行为的特性;
Configuarable: 能否通过delete删除属性,并且重新定义属性,
Enumerable: 能否通过for-in循环返回该属性,
Writable: 能否修改属性的值;
Value: 这个属性的数据值,默认为undefined
根据定义对象的方式不同,Configurable,Enumerable,Writable默认值也不同
方式1: var person = {name: '张三'}
则person对象的name属性的属性描述符对象中的Configurable,Enumerable,Writable 值均默认为true
方式2:
var person = {}
Object.defineProperty(person,'name',{
value: '张三'
})
则person对象的name属性的属性描述符对象中的Configurable,Enumerable,Writable 值均默认为false
// "use strict"
var person = {}
Object.defineProperty(person, 'name', {
value: '张三'
})
console.log(person.name); //张三
//启用严格模式时: "use strict"; Uncaught TypeError: Cannot assign to read only property 'name' of object '#<Object>'
person.name = '李四';
console.log(person.name); //张三访问器属性:不包含数据值,包含一对儿的getter和setter函数
Configuarable: 能否通过delete删除属性,并且重新定义属性,
Enumerable: 能否通过for-in循环返回该属性,
Get: 在读取属性时调用的函数,默认为undefined
Set: 在写入属性时调用的函数,默认为undefined
访问器属性不能直接定义,必须使用Object.defineProperty()来定义
// 1. 自定义容器充当数据的存储
var constObj = {}
function getConst(key, val) {
constObj[key] = val;
Object.defineProperty(constObj, key, {
value: val,
configurable: false, //配置信息是否可修改
writable: false, //是否可修改改属性值
enumerable: true //是否可枚举
})
}
getConst('a', 10)
constObj.a = 20;
console.log(constObj.a); //10
// 2. 挂载到window上面
function getConst2(constKey, constVal) {
window[constKey] = constVal;
Object.defineProperty(window, constKey,{
get: function() { //如果设置了 set 或 get, 就不能设置 writable 和 value 中的任何一个,否则报错
return constVal;
},
enumerable: true, //是否可枚举
configurable: false, //是否可修改当前描述的配置信息
})
}
getConst2('b', 30);
getConst2('c', 50);
console.log(window.b); //30
console.log(window.c); //50
window.b = 66
console.log(window.b); //30
边栏推荐
- 7.常用指令(下)v-on,v-bind,v-model的常见操作
- Compiling protobuf protocol files using makefile in PHP
- sqlServer2008中float类型数据与datetime类型数据互转
- 流数据
- 期末复习【机器学习】
- InputStream流已经关闭了,但是依旧无法delete文件或者文件夹,提示被JVM占用等
- MySQL InnoDB lock knowledge points
- Anaconda一文入门笔记
- Spark日志分析
- Hibernate architecture introduction and environment construction (very detailed)
猜你喜欢

达梦数据库修改字段信息采坑记

Wireshark对IMAP抓包分析

Hibernate entity class curd, transaction operation summary

期末复习【机器学习】

excel如何实现中文单词自动翻译成英文?这个公式教你了

Architecture part -- the use of UMI framework and DVA

后序线索二叉树

SSM整合学习笔记(主要是思路)
![Classic image segmentation network: UNET supports libtorch deployment reasoning [with code]](/img/3a/fb3bfe673db5123e3124404f3905c0.png)
Classic image segmentation network: UNET supports libtorch deployment reasoning [with code]

STL教程5-STL基本概念及String和vector使用
随机推荐
Problems encountered in Doris operation and maintenance
iomanip头文件在实战中的作用
Can I upload pictures without deploying the server?
QT custom implemented calendar control
如何设计产品的roadmap?
解析產品開發失敗的5個根本原因
流数据
Leetcode-1528- rearrange string - hash table - string
MySQL自定义函数实例
How does excel translate Chinese words into English automatically? This formula teaches you
Apache Doris1.0版本集群搭建、负载均衡与参数调优
如何进行流程创新,以最经济的方式提升产品体验?
static关键字详解
Megacli常用命令整理
js实现输入开始时间和结束时间,输出其中包含多少个季,并且把对应年月打印出来
Line height for small use
Hibernate core api/ configuration file / L1 cache details
Stream in PHP socket communication_ Understanding of select method
1.8 billion pixel Mars panorama Ultra HD released by NASA, very shocking
The package name of the manifest file in the library project and the app project are not the same