前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >js和object的常见操作,持续更新中...

js和object的常见操作,持续更新中...

作者头像
何处锦绣不灰堆
发布2020-08-28 09:43:21
1.5K0
发布2020-08-28 09:43:21
举报
文章被收录于专栏:农历七月廿一

PS:

⚠️不是返回值,是提醒注意事项,除⚠️符号之外的均为返回值

  • 将string类型的数组,进行格式化为object类型的数组
代码语言:javascript
复制
let str = "[{'env': '测试', 'problem': '允许', 'protocol': 'TCP', 'source_port': '修改的数据源数据', 'purpose': '修改的数据', 'source_ip': '修改的数据源数据', 'dest_port': '修改的数据源数据', 'partner': '修改的数据源数据', 'dest_ip': '修改的数据源数据', 'id': 0}]"
console.info(eval(str))
//返回值
[
      {
        env: '测试',
        problem: '允许',
        protocol: 'TCP',
        source_port: '修改的数据源数据',
        purpose: '修改的数据',
        source_ip: '修改的数据源数据',
        dest_port: '修改的数据源数据',
        partner: '修改的数据源数据',
        dest_ip: '修改的数据源数据',
        id: 0
      }
 ]
  • 获取对象的key和value
代码语言:javascript
复制
let obj = {
    env: '测试',
    problem: '允许',
    protocol: 'TCP',
    source_port: '源端口',
    purpose: '修改的数据',
    source_ip: '源IP',
}
console.info(Object.keys(obj)) 
//[ 'env', 'problem', 'protocol', 'source_port', 'purpose', 'source_ip' ]
console.info(Object.values(obj))
//[ '测试', '允许', 'TCP', '源端口', '修改的数据', '源IP' ]
  • string 改为数组
代码语言:javascript
复制
let str1 = "tom,jim,mary,tony,karry,jerry"
console.info(str1.split(','))
//[ 'tom', 'jim', 'mary', 'tony', 'karry', 'jerry' ]
  • 数组转为string
代码语言:javascript
复制
let arr2 = ['tom', 'jim', 'mary', 'tony', 'karry', 'jerry']
console.info(arr2.join()) //默认是, //tom,jim,mary,tony,karry,jerry
console.info(arr2.join('-')) //tom-jim-mary-tony-karry-jerry
console.info(arr2.toString()) // tom,jim,mary,tony,karry,jerry
  • 给数组加自定义的key
代码语言:javascript
复制
let arr3 = arr2.map(item => {
    return {
        name: item
    }
})
console.info(arr3)
//返回结果:
 [
      { name: 'tom' },
      { name: 'jim' },
      { name: 'mary' },
      { name: 'tony' },
      { name: 'karry' },
      { name: 'jerry' }
]
  • 更改对象值为数组元素,将key和值重新进行赋值
代码语言:javascript
复制
let arr1 = {
    env: '测试',
    problem: '允许',
    protocol: 'TCP',
    source_port: '源端口',
    purpose: '修改的数据',
    source_ip: '源IP',
}
let newarr = []
for (item in arr1) {
    let obj = {
        key: item,
        value: arr1[item]
    }
    newarr.push(obj)
}
console.info(newarr)
//返回结果:
[
    { key: 'env', value: '测试' },
    { key: 'problem', value: '允许' },
    { key: 'protocol', value: 'TCP' },
    { key: 'source_port', value: '源端口' },
    { key: 'purpose', value: '修改的数据' },
    { key: 'source_ip', value: '源IP' }
]
  • 使用es6获取数组元素
代码语言:javascript
复制
let arr4 = ['name1', 'name2', 'name3', 'name4']
console.info(...arr4)
//name1 name2 name3 name4
  • 连接对象 【常规方法】
代码语言:javascript
复制
let obj3 = {
    env: '测试',
    problem: '允许',
    protocol: 'TCP',

}
let obj4 = {
    source_port: '源端口',
    purpose: '修改的数据',
    source_ip: '源IP',
}
let newobj1 = { id: 0 }
console.info(Object.assign(newobj1, obj3, obj4))
//返回结果:
 {
    id: 0,
    env: '测试',
    problem: '允许',
    protocol: 'TCP',
    source_port: '源端口',
    purpose: '修改的数据',
    source_ip: '源IP'
 }
  • 连接对象 【es6方法】
代码语言:javascript
复制
let obj5 = {
    env: '测试',
    problem: '允许',
    protocol: 'TCP',

}
let obj6 = {
    source_port: '源端口',
    purpose: '修改的数据',
    source_ip: '源IP',
}
let obj7 = { id: 0, ...obj5, ...obj6 }
console.info(obj7)
//返回结果:
{
       id: 0,
       env: '测试',
       problem: '允许',
       protocol: 'TCP',
       source_port: '源端口',
       purpose: '修改的数据',
       source_ip: '源IP'
}
  1. 判断两个对象是否相等
代码语言:javascript
复制
let obj8 = { name: 'tom' }
let obj9 = { name: 'tom' }
console.info(obj8 === obj9) //false
console.info(obj8 == obj9) //false
console.info(JSON.stringify(obj8) === JSON.stringify(obj9)) //true
  1. 删除数组某几个元素 替换新的元素
代码语言:javascript
复制
    //删除数组
let arr5 = ['name1', 'name2', 'name3', 'name4', 'name5', 'name6']
console.info(arr5.splice(2, 1, 'name7', 'name8')) 
//name3 ⚠️返回的是被删除的元素
console.info(arr5) 
//['name1', 'name2','name7', 'name8','name4', 'name5','name6']
  1. 删除数组第一个元素
代码语言:javascript
复制
let arr6 = ['name1', 'name2', 'name3', 'name4', 'name5', 'name6']
console.info(arr6.shift()) 
//name1  ⚠️返回的是被删除的元素
console.info(arr6) 
//[ 'name2', 'name3', 'name4', 'name5', 'name6' ]
  1. 删除数组最后一个元素
代码语言:javascript
复制
let arr7 = ['name1', 'name2', 'name3', 'name4', 'name5', 'name6']
console.info(arr7.pop()) 
//name6 ⚠️返回的是被删除的元素
console.info(arr7) 
//[ 'name1', 'name2', 'name3', 'name4', 'name5' ]
  1. 从数组第一位新增元素
代码语言:javascript
复制
let arr8 = ['name1', 'name2', 'name3', 'name4', 'name5', 'name6']
console.info(arr8.unshift('name0')) 
// 7 ⚠️返回的是数组的长度 7
console.info(arr8) 
//['name0', 'name1', 'name2', 'name3', 'name4', 'name5', 'name6' ]
  1. 从数组最后新加一个元素
代码语言:javascript
复制
let arr9 = ['name1', 'name2', 'name3', 'name4', 'name5', 'name6']
console.info(arr9.push('name7')) 
//7 ⚠️返回数组的长度 7
console.info(arr9)
['name1', 'name2', 'name3', 'name4', 'name5', 'name6','name7']
  1. 数组反序
代码语言:javascript
复制
let arr10 = ['name1', 'name2', 'name3', 'name4', 'name5', 'name6']
console.info(arr10.reverse()) 
//[ 'name6', 'name5', 'name4', 'name3', 'name2', 'name1' ]
  1. 数组连接
代码语言:javascript
复制
let arr11 = ['name4', 'name5', 'name6']
let arr12 = ['name1', 'name2', 'name3']
console.info(arr11.concat(arr12))
//[ 'name4', 'name5', 'name6', 'name1', 'name2', 'name3' ]
  1. 判断是不是数组
代码语言:javascript
复制
let arr13 = ['name1', 'name2', 'name3']
console.info(Array.isArray(arr13))
//true
  1. 截取数组
代码语言:javascript
复制
let arr14 = ['name1', 'name2', 'name3', 'name4', 'name5', 'name6']
console.info(arr14.slice(2, 4))
//name3 name4  ⚠️从第二个开始到第4个,含前不含后 不改变原数组
console.info(arr14)
//[ 'name1', 'name2', 'name3', 'name4', 'name5', 'name6' ]
  • 去掉数组的__ob__: Observer属性
  1. 类似这样的格式: ps : vue官方文档
在这里插入图片描述
在这里插入图片描述
  1. 转为这样的格式:
在这里插入图片描述
在这里插入图片描述
代码语言:javascript
复制
JSON.parse(JSON.stringify(arr)) //⚠️结果如上图 原生js不会出现,这个是vue操作的副本
  • 待续…
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2020/08/27 ,如有侵权请联系 cloudcommunity@tencent.com 删除

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

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

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

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档