javascript中常用的对象操作方法

antz 发布于2019-08-22 17:31 / 1672人阅读

摘要：返回组成的数组返回对象的组成的数组返回一个由组成的数组，其元素是在对象上找到的可枚举属性值。深拷贝对象返回深拷贝的对象，修改不会影响该对象返回对象的和组成的数组方法返回一个对象和键值对组成的数组方法判断对象中属性是否存在

Object.keys(obj)     返回对象的key组成的数组

返回一个所有元素为字符串的数组，其元素来自于从给定的object上面可直接枚举的属性,不会返回原型上的方法。

const obj = {
    firstname:"John",
    lastname:"Doe",
    age:50,
    eyecolor:"blue"
};
console.log(Object.keys(obj))
["firstname", "lastname", "age", "eyecolor"] //返回key组成的数组

Object.values(obj)  返回对象的value组成的数组

返回一个由value组成的数组，其元素是在对象上找到的可枚举属性值。

const obj = {
    firstname:"John",
    lastname:"Doe",
    age:50,
    eyecolor:"blue"
};
console.log(Object.values(obj))
["John", "Doe", 50, "blue"]   //返回value组成的数组

Object.assign() 可以将源对象复制到目标对象中

Object.assign(target, ...sources)
target 为目标对象，...sources 为源对象(可以为多个对象)

//  浅拷贝对象
const obj = {
    firstname:"John",
    lastname:"Doe",
    age:50,
    love:{
        color: "blue",
        sport: "football"
    }
};
const copy = Object.assign({}, obj);
console.log(copy) // 返回浅拷贝的对象，修该obj会同时修改copy的值


// 合并多个对象
const obj = {
    firstname:"John",
    lastname:"Doe",
    age:50,
    love:{
        color: "blue",
        sport: "football"
    }
};
const obj2 = { other: "cat" };
const obj3 = { car: "Benz" };

const  compose = Object.assign(obj, obj2, obj3); // 返回三个对象合并组成的对象，如有相同属性则会被后续参数中具有相同属性覆盖。


// 深拷贝对象
const obj = {
    firstname:"John",
    lastname:"Doe",
    age:50,
    love:{
        color: "blue",
        sport: "football"
    }
};
const deepClone = JSON.parse(JSON.stringify(obj)); // 返回深拷贝的对象，修改obj不会影响该对象

Object.entries(obj)     返回对象的key和value组成的数组

Object.entries(obj) 方法返回一个对象key和value键值对组成的数组

const obj = { foo: "bar", baz: 42 };
console.log(Object.entries(obj));
// [["foo", "bar"], ["baz", 42]]

obj.hasOwnProperty() hasOwnProperty 方法判断对象中属性是否存在

const obj = {
    firstname:"John",
    lastname:"Doe",
    age:50,
    love:{
        color: "blue",
        sport: "football"
    }
};
console.log(obj.hasOwnProperty("love")) // true

云服务器海外云主机 js，对象中增加数据的方法 javascript对象方法 jquery常用的方法常用的数据统计方法

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/95245.html

常用JavaScript操作CSS方法总结

摘要：返回值一个对象集合，包含六个属性上下左右宽高注意只用于行内元素只能获取样式只读获取元素位置获得页面中某个元素的左，上，右和下分别相对浏览器视窗的位置。返回一个类数组对象，其包含样式表中所有规则。 [TOC] 获取样式元素对象的宽高位置距离等属性如offsetWidht、cilentWidht、scrollWidth…… let oWidth=obj.offsetWidth; 注意...

enali 2019-08-21 18:19 评论0 收藏0
JavaScript：对Object对象的一些常用操作总结

摘要：一可以用作对象的复制可以用作对象的合并注意目标对象自身也会改变。对象四返回一个数组，包括对象自身的不含继承的所有可枚举属性不含属性的键名。该方法返回被冻结的对象。方法判断一个对象是否被冻结。 JavaScript对Object对象的一些常用操作总结。一、Object.assign() 1.可以用作对象的复制 var obj = { a: 1 }; var copy = Object....

马龙驹 2019-08-23 12:46 评论0 收藏0
个人常用JavaScript及React常用优化总结

摘要：插件性能优化及个人常用优化方法经常会触发视觉变化。作用域链指的是当前作用于下可用变量的集合，它在各种主流浏览器中至少包含两个部分局部变量的集合和全局变量的集合。在考虑优化时，数值和变量的性能差不多，并且速度显著优于对象属性和数组元素。 JavaScript 插件性能优化及个人react常用优化方法 JavaScript 经常会触发视觉变化。有时是直接通过样式操作，有时是会产生视觉变化...

yuanxin 2019-08-20 15:07 评论0 收藏0
常用JavaScript小技巧及原理详解

摘要：使用一元加模拟函数原理对非数值类型的数据使用一元加，会起到与函数相同的效果。中，若判断不为则不再进行下一步操作。使用逻辑或设置默认值逻辑或也属于短路操作，即当第一个操作数可以决定结果时，不再对第二个操作数进行求值。善于利用JS中的小知识的利用，可以很简洁的编写代码 1. 使用!!模拟Boolean()函数原理：逻辑非操作一个数据对象时，会先将数据对象转换为布尔值，然后取反，两个!!...

chnmagnus 2019-08-20 17:00 评论0 收藏0
[ ES6 ] 快速掌握常用 ES6 （二）

摘要：本系列文章适合快速掌握入门语法，想深入学习的小伙伴可以看看阮一峰老师的入门本篇文章是对之前文章的一个补充，可以使代码更简洁函数参数默认值在传统语法中如果想设置函数默认值一般我们采用判断的形式在新的语法中我们可以在参数声明的同时赋予默认值参数本系列文章适合快速掌握 ES6 入门语法，想深入学习 ES6 的小伙伴可以看看阮一峰老师的《ECMAScript 6 入门》本篇文章是对之前文章...

hidogs 2019-08-23 14:07 评论0 收藏0