Object.keys()、Object.values()的用法

2024-07-11 15:38| 来源: 网络整理| 查看: 265

文章目录一.Object.keys()的用法1.Object.keys()介绍2.Object.keys()语法3.Object.keys()举例二.Object.values()的用法1.Object.values()介绍2.Object.values()语法3.Object.values()举例三.总结

一.Object.keys()的用法 1.Object.keys()介绍

Object.keys()方法会返回一个由一个给定对象的自身可枚举属性组成的数组(返回字符串数组)，数组中属性名的排列顺序和正常循环遍历该对象时返回的顺序一致。

2.Object.keys()语法

Object.keys(obj)obj要返回其枚举自身属性的对象。返回值:一个表示给定对象的所有可枚举属性的字符串数组。

3.Object.keys()举例

①对象,返回对象的key值组成的数组(字符串)

let obj={ name:"zhangsan", age:18, gender:"male" } console.log(Object.keys(obj));//[ 'name', 'age', 'gender' ]

②数组,返回数组索引值组成的数组(字符串)

let arr = [1,2,3]; console.log(Object.keys(arr));//[ '0', '1', '2' ]

③字符串,返回字符串索引组成的数组(字符串)

let str = "Hello"; console.log(Object.keys(str));//[ '0', '1', '2', '3', '4' ]

④构造函数,返回空数组或构造函数的属性名组成的数组

function Fn(name,age,gender){ this.name=name; this.age=age; this.gender=gender; } console.log(Object.keys(Fn));//[] let zhangsan = new Fn("张三",18,"male"); console.log(Object.keys(zhangsan));//[ 'name', 'age', 'gender' ]

⑤实用技巧

let zhangsan={ name:"张三", age:18, gender:"male" } Object.keys(zhangsan).map(key=>{ console.log(key+':'+zhangsan[key]); }) // name:张三 // age:18 // gender:male

⑥注意在ES5里，如果此方法的参数不是对象（而是一个原始值），那么它会抛出 TypeError。在ES2015中，非对象的参数将被强制转换为一个对象。

Object.keys("foo"); // TypeError: "foo" is not an object (ES5 code) Object.keys("foo"); // ["0", "1", "2"] (ES2015 code)

当传入的对象的key是整数类型的时候,Object.keys()会返回有序的值。

let zhangsan={ 40:"张三", 20:18, 30:"male" } console.log(Object.keys(zhangsan));//[ '20', '30', '40' ] Object.keys(zhangsan).map(keys=>{ console.log(keys+':'+zhangsan[keys]); }) // [ '20', '30', '40' ] // 20:18 // 30:male // 40:张三二.Object.values()的用法 1.Object.values()介绍

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

let zhangsan={ name:"张三", age:18, gedner:"male" } for(let item in zhangsan){ console.log(item);// name age gender } console.log(Object.values(zhangsan));//[ '张三', 18, 'male' ] 2.Object.values()语法

Object.values(obj) obj被可枚举属性的对象。返回值:一个包含对象自身的所有可枚举属性值的数组。

3.Object.values()举例

①对象,返回对象的value值组成的数组(字符串)

let zhangsan={ name:"张三", age:18, gedner:"male" } console.log(Object.values(zhangsan));//[ '张三', 18, 'male' ]

②数组,返回该数组(字符串)

let arr = [20,10,30]; console.log(Object.values(arr));//[ 20, 10, 30 ]

③字符串,返回单个字符组成的数组(字符串)

let str = "hello"; console.log(Object.values(str));//[ 'h', 'e', 'l', 'l', 'o' ]

④构造函数,返回空数组或实例化对象传入的值组成的数组

function Fn(name,age,gender){ this.name=name; this.age=age; this.gender=gender; } console.log(Object.values(Fn));//[] let mark = new Fn("mark",18,"male"); console.log(Object.values(mark));//[ 'mark', 18, 'male' ]

与Object.keys()相同的是:当传入的对象的键为整数类型时,Object.values()会返回有序的值组成的数组。

let obj = {40:"mark",20:18,30:"male"}; console.log(Object.keys(obj)); console.log(Object.values(obj)); // [ '20', '30', '40' ] // [ 18, 'male', 'mark' ] 三.总结

这里特地记录下Object.key() 、Object.values()的使用方法,方便在工作中使用Object.key() 、Object.values()会根据对象类型的不同返回不同的参数,特别需要注意的是它们都是返回的数组形式,Object.key()返回的是字符串形式的数组。

【本文地址】

公司简介

联系我们