js 对象的基本用法
2021/10/29 23:17:43
本文主要是介绍js 对象的基本用法,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
对象定义
无序的数据集合
键值对的集合
声明对象的语法
语法:两种声明方式
let obj = {'name':'Jack','age':18} //方式一
let obj = new Object({'name':'Jack'}) //方式二
注意:键名是字符串,不是标识符,可以包含任意字符;引号可省略,省略之后就只能写标识符了。
没有数字键名!!键名是字符串!!
细节:
用Object.keys(obj)可以打印出obj的所有key。
如果想用变量的值作为属性名,用中括号[]扩起来,例如:
let a = 'xxx'
let obj = {
[a]:1111 //打印obj,结果为:{xxx:1111}
}
//写法等同于
let a = 'xxx'
let obj = {}
obj[a] = 1111
如何删除对象的属性
语法:删除obj的xxx属性
delete obj.xxx
//或者
delete obj['xxx']
如何判断一个属性名是否在这个对象中?
'xxx' in obj
含有属性名但是值为undefined?
'xxx' in obj && obj.xxx ==== undefined
不能通过http://obj.xxx ==== undefined断定'xxx'是否为obj的属性
如何查看对象的属性
1. 查看自身所有属性
Object.keys(obj) //查看所有的key
Object.values(obj) //查看所有的value
Object.entries(obj) //查看所有的key和value
2. 查看自身+共有属性
console.dir(obj)
或者依次使用Object.keys(obj)打印出obj.__proto__
3. 判断一个属性是自身的还是共有的
obj.hasOwnProperty('toString')
4. 查看属性
obj['key'] //中括号语法
obj.key //点语法
如何修改或增加对象的属性
1. 批量赋值
Object.assign(obj,{age:18,gender:'man'})//理解为向对象obj中增加属性age、gender及对应值
2. 直接赋值
let obj = {name:'Jack',age:18} //name是字符串
//方式一:直接修改name值
obj.name = 'Tom'
obj['name'] = 'Tom'
obj['na'+'me'] = 'Tom'
//方式二:先声明一个变量,再通过中括号把变量名括起来
let key = 'name'
obj.[key] = 'Tom' //等价于obj.['name'] = 'Tom'
//增加性别属性值和属性名
obj.gender = 'man'
3.修改或增加共有属性
无法通过自身修改或增加共有属性
如果一定要修改共有属性,推荐写法:Object.prototype.toString = 'xxx'
不推荐使用:obj.__proto__.toString = 'xxx'
4. 修改隐藏属性
推荐使用Object.create()
let common = {Nationality:'China',Color:'black'}
let obj = Object.create(common)
obj.name = 'Tom'
Object.assign(obj,{name:'Tom',age:18})
细节:'name' in obj和obj.hasOwnProperty('name') 的区别
区别是:
'name' in obj 不能判断name这个属性是对象obj的自有属性还是原型中共有属性,只能判断属性名name是否在obj这个对象中
obj.hasOwnProperty('name') 可以判断name属性是否是对象obj的共有属性
————————————————
版权声明:本文为CSDN博主「玖玥草莓」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/weixin_33040687/article/details/112499785
这篇关于js 对象的基本用法的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-11-15useCallback教程:React Hook入门与实践
- 2024-11-15React中使用useContext开发:初学者指南
- 2024-11-15拖拽排序js案例详解:新手入门教程
- 2024-11-15React中的自定义Hooks案例详解
- 2024-11-14受控组件项目实战:从零开始打造你的第一个React项目
- 2024-11-14React中useEffect开发入门教程
- 2024-11-14React中的useMemo教程:从入门到实践
- 2024-11-14useReducer开发入门教程:轻松掌握React中的useReducer
- 2024-11-14useRef开发入门教程:轻松掌握React中的useRef用法
- 2024-11-14useState开发:React中的状态管理入门教程