美文网首页
js object方法

js object方法

作者: 醉青风 | 来源:发表于2021-08-23 10:22 被阅读0次

按常用排序

1、Object.keys(obj)

返回对象的key名数组
返回一个由一个给定对象的自身可枚举属性组成的数组,数组中属性名的排列顺序和使用 for...in 循环遍历该对象时返回的顺序一致 (两者的主要区别是 一个 for-in 循环还会枚举其原型链上的属性)。

<script>
    let arr = ["a", "b", "c"];
    console.log(Object.keys(arr));
    //["0", "1", "2"]
    /* Object 对象 */
    let obj = {
            age: 20,
            sex: '男'
        },
    keys = Object.keys(obj);
    console.log(keys);
    //["age", "sex"]
</script>

2、Object.values()

返回对象的值数组
方法返回一个给定对象自己的所有可枚举属性值的数组,值的顺序与使用for...in循环的顺序相同 ( 区别在于 for-in 循环枚举原型链中的属性 )。

    var obj = {
        10: 'a',
        1: 'b',
        2: 'c'
    };
    console.log(Object.values(obj));
    // ['b', 'c', 'a']
3、Object.freeze()

阻止修改对象里面的值和阻止添加新元素,只对对象有用
简单的数据类型使用 const

let obj = Object.freeze({
          a:5
        })
obj.a = 8
 obj.b = 8
console.log(obj)
// 直接报错
4、Object.assign()

合并多个对象,其实和扩展符的作用一样,都是浅拷贝
可以用来处理数组去重

   let obj = {
          a:5
        }
        let obj2 = {
          b:8
        }
        console.log(Object.assign(obj,obj2))
        console.log({...obj,...obj2})


 Object.assign([1, 2, 3], [4, 5])
    console.log(Object.assign([1, 2, 3], [4, 5]), '数组使用该方法===')
    // [4, 5, 3]
    // 把数组当作对象来处理
5、hasOwnProperty()

判断对象自身属性中是否具有指定的属性。

let obj = {
             a:5,
             b:6
 }
 console.log(obj.c)  //undefined
console.log(obj.hasOwnProperty('a'))  // true
 console.log(obj.hasOwnProperty('c'))  //false
6,Object.defineProperties(obj,props)

直接在一个对象上定义新的属性或修改现有属性,并返回该对象。

 var obj = {property1:888,property3:777};
Object.defineProperties(obj, {
  'property1': {
    value: 123,
    writable: false
  },
  'property2': {
    value: 'Hello,word',
    writable: true
  }
});
console.log(obj)   
obj.property2 = 456 //修改了
console.log(obj)   
obj.property1 = 456 //不能修改
console.log(obj) 
7、Object.defineProperty(obj,prop,descriptor)

obj---需要定义属性的对象;
prop---需定义或修改的属性的名字;
descriptor---将被定义或修改的属性的描述符;

在一个对象上定义一个新属性,或者修改一个对象的现有属性, 并返回这个对象。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>test</title>
    </head>
    <body>
        <div id="test">这是一个测试</div>
        <script>
            var test = document.getElementById("test");
            var data = {};
            var i = 0;
            Object.defineProperty(data, "b", {
                set: function(newValue) {
                    //当data.b的值改变的时候更新#test的视图 
                    test.textContent = newValue;
                },
                get: function() {}
            });
            setInterval(function() {
                i++;
                data["b"] = "data.b的值更新了,视图更新" + i;
            }, 1000);
        </script>
    </body>
</html>

8、Object.getOwnPropertyNames()

获取一个对象的所有键,并组成数组(包括不可枚举属性但不包括Symbol值作为名称的属性)

var obj = {
        age: 10,
        sex: "男",
        name: "bob"
 };
console.log(Object.getOwnPropertyNames(obj))
//["age", "sex", "name"]

9、Object.is()

判断两个值是否相同

  console.log(Object.is('foo', 'foo'))// true

10、Object.getOwnPropertyDescriptors(obj)

获取一个对象的所有自身属性的描述符。

相关文章

  • js与ES6对象常用方法区别

    js与ES6对象常用方法区别js中对象方法 Object.assign//用于克隆 Object.is()…用于判...

  • js中Object.defineProperty()方法的解释

    js中Object.defineProperty()方法的解释 菜菜: “老大,那个, Object.define...

  • js object方法

    按常用排序 1、Object.keys(obj) 返回对象的key名数组返回一个由一个给定对象的自身可枚举属性组成...

  • js object 方法

    1、Object.prototype.toString数组、对象判断具体的类型 2、Object.assign()...

  • js拼接html中onclick方法传对象

    js拼接html中方法传参对象func('obj') 防止变成 func('[object object]

  • hasOwnProperty()

    一、hasOwnProperty() js原生方法, object.prototype.hasOwnPropert...

  • 快速将字符串变成数组

    方法一:构造函数 方法二:js方法(split) 方法三:Array.from() 方法四:Object.valu...

  • 2019-03-22

    js字符串转译为unicode的方法: unicode解码方法 js对象(object)变成url的形式 列表的排序

  • js Object 常用方法

    Object.assign(target,source1,source2,...) 该方法主要用于对象的合并,将源...

  • JS:Object.keys()方法

    JS: Object.keys()方法 Object.keys() 方法会返回一个由一个给定对象的自身可枚举属性组...

网友评论

      本文标题:js object方法

      本文链接:https://www.haomeiwen.com/subject/jgvkiltx.html