(超全)javascript对象的方法总结

js对象的方法总结

在这里插入图片描述

一种总结了11种对象方法

开始喽!

Object.assign() – ES6

通过复制一个或多个对象来创建一个新的对象。

Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象。它将返回目标对象。

—复制的对象是一层 --> 深拷贝

—复制的对象是多层 --> 浅拷贝

const target = { a: 1, b: 2 };
const source = { b: 4, c: 5 };
const returnedTarget = Object.assign(target, source);
console.log(target); // { a: 1, b: 4, c: 5 }
console.log(returnedTarget); // { a: 1, b: 4, c: 5 }

Object.create()

使用指定的原型对象和属性创建一个新对象。

Object.create()方法创建一个新对象,使用现有的对象来提供新创建的对象的__proto__。

const person = {
  isHuman: false,
  printIntroduction: function () {
    console.log(`My name is ${this.name}. Am I human? ${this.isHuman}`);
  }
};

const me = Object.create(person);

me.name = "Matthew"; // "name" is a property set on "me", but not on "person"
me.isHuman = true; // inherited properties can be overwritten

me.printIntroduction();
// expected output: "My name is Matthew. Am I human? true"

Object.defineProperty()

给对象添加一个属性并指定该属性的配置。

Object.defineProperty() 方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性, 并返回这个对象。

语法 Object.defineProperty(obj, prop, descriptor) obj要在其上定义属性的对象。prop要定义或修改的属性的名称。descriptor将被定义或修改的属性描述符。

Object.defineProperties()

给对象添加多个属性并分别指定它们的配置。

Object.defineProperties() 方法直接在一个对象上定义新的属性或修改现有属性,并返回该对象。

语法 Object.defineProperties(obj, props) obj在其上定义或修改属性的对象。props要定义其可枚举属性或修改的属性描述符的对象。

var obj = {};
Object.defineProperties(obj, {
  'property1': {
    value: true,
    writable: true
  },
  'property2': {
    value: 'Hello',
    writable: false
  }
});
console.log(obj); //  property1: true  property2: "Hello"

Object.entries() – ES6

返回给定对象自身可枚举属性的[key, value]数组。

Object.entries()方法返回一个给定对象自身可枚举属性的键值对数组,其排列与使用 for…in 循环遍历该对象时返回的顺序一致(区别在于 for-in 循环也枚举原型链中的属性)

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

const object2 = { 0: 'a', 1: 'b', 2: 'c' };
console.log(Object.entries(object2)[2]); // ["2", "c"]

const result = Object.entries(object2).sort((a, b) => a - b);
console.log(Object.entries(result)[1]); // ["1", Array ["1", "b"]]

Object.is() – ES6

比较两个值是否相同。所有 NaN 值都相等(这与=不同)。

Object.is() 方法判断两个值是否是相同的值

Object.is('foo', 'foo');     // true
Object.is(window, window);   // true

Object.is('foo', 'bar');     // false
Object.is([], []);           // false

var foo = { a: 1 };
var bar = { a: 1 };
Object.is(foo, foo);         // true
Object.is(foo, bar);         // false

Object.is(null, null);       // true

// 特例
Object.is(0, -0);            // false
Object.is(-0, -0);           // true
Object.is(NaN, 0/0);         // true

Object.keys() – ES6

返回一个包含所有给定对象自身可枚举属性名称的数组。

Object.keys() 方法会返回一个由一个给定对象的自身可枚举属性组成的数组,数组中属性名的排列顺序和使用 for…in 循环遍历该对象时返回的顺序一致 。

var arr = ['a', 'b', 'c'];
console.log(Object.keys(arr)); // console: ['0', '1', '2']

var obj = { 0: 'a', 1: 'b', 2: 'c' };
console.log(Object.keys(obj)); // console: ['0', '1', '2']

var anObj = { 100: 'a', 2: 'b', 7: 'c' };
console.log(Object.keys(anObj)); // console: ['2', '7', '100']

var myObj = Object.create({}, {
  getFoo: {
    value: function () { return this.foo; }
  } 
});
myObj.foo = 1;
console.log(Object.keys(myObj)); // console: ['foo']

Object.values() – ES6

返回给定对象自身可枚举值的数组。

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

var obj = { foo: 'bar', baz: 42 };
console.log(Object.values(obj)); // ['bar', 42]

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

var an_obj = { 100: 'a', 2: 'b', 7: 'c' };
console.log(Object.values(an_obj)); // ['b', 'c', 'a']

var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; } } });
my_obj.foo = 'bar';
console.log(Object.values(my_obj)); // ['bar']

console.log(Object.values('foo')); // ['f', 'o', 'o']

hasOwnProperty()

方法用于检测一个对象是否含有特定的自身属性,返回一个布尔值

 	function Fn() {
      this.age = 'wm'
    }
    Fn.prototype.sex = '女'
    var obj = new Fn()
    //  实例化对象会继承构造函数里的属性和方法
    console.log(obj.hasOwnProperty('age')) // true
    console.log(Fn.prototype.hasOwnProperty('age')) //false
    console.log(Fn.prototype.hasOwnProperty('sex')) //true
    console.log(obj.hasOwnProperty('sex')) // false

isPrototypeOf()

用来判断要检查其原型链的对象是否存在于指定对象实例中,是则返回true,否则返回false。

1.利用isPrototypeOf()检查一个对象是否存在另一个对象的原型上

var o={};
function Person(){};
var p1 =new Person();//继承自原来的原型,但是现在已经无法访问
Person.prototype=o;
var p2 =new Person();//继承自o
console.log(o.isPrototypeOf(p1));//false o是不是p1的原型

2.利用isPropertyOf()检查一个对象是否存在一另一个对象的原型链

var o={};
function Person(){};
var p1 =new Person();//继承自原来的原型,但是现在已经无法访问
Person.prototype=o;
var p2 =new Person();//继承自o
console.log(o.isPrototypeOf(p1));//false o是不是p1的原型
console.log(o.isPrototypeof(p2));//true  o是不是p2的原型
 
console.log(Object.prototype.isPrototypeOf(p1));//true
console.log(Object.prototype.isPrototypeOf(p2));//true
  • p1的原型链结构是p1=>原来的Person.prototype=>Object.prototype=>`null``
  • p2的原型链结构是p2=> o =>Object.prototype=>null
  • p1p2都拥有Object.prototype所以他们都在Object.Prototype的原型链上

instanceof

A instanceof B

说法1:B 的prototype是否在A的原型链上

说法2:A对象是否是B对象的实例

说法3:B对象是否是A对象的父对象

在这里插入图片描述

笑,全世界便与你同声笑,哭,你便独自哭。——张爱玲

  • 1
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值