20·灵魂前端工程师养成-JavaScript对象

DriverZeng

发布于 2022-09-26 16:36:03

1660

发布于 2022-09-26 16:36:03

-曾老湿, 江湖人称曾老大。

-多年互联网运维工作经验，曾负责过大规模集群架构自动化运维管理工作。 -擅长Web集群架构与自动化运维，曾负责国内某大型金融公司运维工作。 -devops项目经理兼DBA。 -开发过一套自动化运维平台（功能如下）： 1)整合了各个公有云API，自主创建云主机。 2)ELK自动化收集日志功能。 3)Saltstack自动化运维统一配置管理工具。 4)Git、Jenkins自动化代码上线及自动化测试平台。 5)堡垒机，连接Linux、Windows平台及日志审计。 6)SQL执行及审批流程。 7)慢查询日志分析web界面。

JS对象基本用法

JS对象

定义：无序的数据集合，键值对的集合

写法：

let obj = {'name': 'zls', 'age': 18}

let obj = new Object({ 'name': 'zls' })

console.log({ 'name': 'zls', 'age': 18 })

奇怪的属性名：

let obj = {
  1: 'a',
  3.2: 'b',
  1e2: true
  1e-2: true,
  .234: true,
  0xFF: true
};

Object.keys(obj)
["1","100","255","3.2","0.01","0.234"]

使用变量做属性名：

var a = 'xxxx'

var obj = {
    
    [a]: 1
}

obj
{xxxx: 1}

var obj = {
    [1+2+3+4]: '十'
}

obj
{10: "十"}

Object.keys(obj)
["10"]

JS对象的增删改查

删除属性

// 方法1
var obj = {name: 'zls', age: 18}

delete obj.name
true

obj
{age: 18}

// 方法2
var obj3 = {name: 'zls', age: 18}

delete obj['name']
true

// 方法3
var obj2 = {name: 'zls', age: 18}

obj.name = undefined

obj
{age: 18, name: undefined}

delete 删除key 和 value

undefined 只删除 value

判断是否删除成功：

// 判断key在不在对象中
'name' in obj
false

'age' in  obj

true


// 判断key在不在对象中，如果在，值是不是undefined
var obj4 = {name: 'zls', age: 18}

obj.name = undefined

'name' in obj && obj.name === undefined
true

查看属性（读属性）

// 定义对象
var obj = {name: 'zls', age: 18}

// 查看对象的key
Object.keys(obj)
(2) ["name", "age"]


// 查看对象的value
Object.values(obj)
(2) ["zls", 18]

// 既查看key 又查看value
obj
{name: "zls", age: 18}

Object.entries(obj4)
(2) [Array(2), Array(2)]
0: (2) ["name", "zls"]
1: (2) ["age", 18]

// 查看自身属性+共有属性
console.dir(obj)
VM1405:1 Objectname: "zls"age: 18__proto__: Object


obj.__proto__  // 这种方式不推荐
{constructor: ƒ, __defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, __lookupGetter__: ƒ, …}

// 判断是否含有某属性
'toString' in obj
true

// 判断这个属性是自身的 还是共有的

obj.hasOwnProperty('toString')
false

obj.hasOwnProperty('name')
true

必须搞清楚的一道题：

let list = ['name','age','gender']
let person = {
  name: 'zls',age: 18,gender: 'male'
}

for(let i=0;i<list.length;i++){
  let name = list[i]
}

// 如何打印出person的所有属性？
console.log(person.name)
console.log(person['name'])
console.log(person[name])

增加、修改属性（写属性）

//直接赋值
let obj = {name: 'zls'} //name是字符串
obj.name = 'zls' //name是字符串
obj['name'] = 'zls'

obj[name] = 'zls' //错，因为name值不确定

obj['na'+'me'] = 'zls'

let key = 'name';obj[key] = 'zls'

let key = 'name';obj.key = 'zls' //错，因为obj.key 等价于 obj['key']

//批量赋值
Object.assing(obj,{age: 18,gender: 'male'})

var obj = {name: 'zls'}

obj.name = 'drz'
"drz"

obj.age = 80
80

obj
{name: "drz", age: 80}

obj.gender = 'male'
"male"

obj
{name: "drz", age: 80, gender: "male"}

Object.assign(obj,{height: 182,weight: 120})
{name: "drz", age: 80, gender: "male", height: 182, weight: 120}

修改或增加共有属性

1、无法通过自身修改或增加共有属性

let obj = {} obj2 = {} //共有 toString
obj.toString = 'xxx' // 只会修改在obj自身属性
obj2.toString // 还是在原型上

2.偏要修改或增加原型上的属性

obj.__proto__.toString = 'xxx' //不推荐使用__proto__

Object.prototype.toString = 'xxx' // 但是一般来说不要修改原型，会引起很多问题

修改隐藏属性

1、不推荐使用 __proto__

let oobj = {name: 'zls'}
let obj2 = {name: 'drz'}
let common = {kind: 'human'}

obj.__proto__ = common
obj2.__proto = common

2、推荐使用Object.create

let obj = Object.create(common)
obj.name = 'zls'

let obj2 = Object.create(common)
obj2.name = 'drz'

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2019-05-08，如有侵权请联系 cloudcommunity@tencent.com 删除

运维

自动化

本文分享自作者个人站点/博客前往查看

如有侵权，请联系 cloudcommunity@tencent.com 删除。

本文参与腾讯云自媒体同步曝光计划，欢迎热爱写作的你一起参与！

运维

自动化

登录后参与评论

0 条评论

热度