Methods of Object in JavaScript

Summary of object methods in JavaScript:

Source: Wangdao-Internet Development Documentation [https://wangdoc.com/]

1、Object.getPrototypeOf(Object)

The Object.getPrototypeOf method returns the prototype of the parameter object. This is the standard way to obtain a prototype object.
Code example:

    var F = function () {
    
    };
    var f = new F();
    Object.getPrototypeOf(f) === F.prototype // true
  几种特殊对象的方法:
    // 空对象的原型是 Object.prototype
    Object.getPrototypeOf({
    
    }) === Object.prototype // true

    // Object.prototype 的原型是 null
    Object.getPrototypeOf(Object.prototype) === null // true

    // 函数的原型是 Function.prototype
    function fun() {
    
    }
    Object.getPrototypeOf(fun) === Function.prototype // true

2、Object.setPrototypeOf(nowObject,originalObject)

The Object.setPrototypeOf method sets the prototype for the parameter object and returns the parameter object. It accepts two parameters, the first is the existing object and the second is the prototype object.
The method is similar to the object produced by new
. Code example:

    var a = {
    
    };
    var b = {
    
    x: 1};
    Object.setPrototypeOf(a, b);

    Object.getPrototypeOf(a) === b // true
    a.x // 1

3、Object.create(Object)

The Object.create() method accepts an object as a parameter, and then uses it as a prototype to return an instance object. This instance completely inherits the properties and methods of the prototype object
. Code example:

 // 原型对象
      var A = {
    
    
        print: function () {
    
    
          console.log('hello');
        }
      };

      // 实例对象
      var B = Object.create(A); //通过对象上的create方法,B继承拥有了A的属性以及方法

      Object.getPrototypeOf(B) === A // true
      B.print() // hello
      B.print === A.print // true

Note:
1. The create method must provide the object prototype. If the parameter is empty or the parameter is not an object, the code will report an error.
2. The new object generated by the create() method dynamically inherits the prototype. Adding or modifying any method on the prototype will be immediately reflected on the new object. Equivalent to shallow copy

Instance object methods:

1、Object.prototype.isPrototypeOf()

The isPrototypeOf method of the instance object is used to determine whether the object is the prototype of the parameter object.
Sample code:

console.log(Object.prototype.isPrototypeOf({
    
    })) // true
console.log(Object.prototype.isPrototypeOf([])) // true
console.log(Object.prototype.isPrototypeOf(/xyz/)) // true
console.log(Object.prototype.isPrototypeOf(Object.create(null))) // false

In the above code, since Object.prototype is at the top of the prototype chain, true is returned for all instances, except for objects that directly inherit from null.

2、Object.getOwnPropertyNames()

The Object.getOwnPropertyNames method returns an array whose members are the key names of all properties of the parameter object itself, excluding inherited property key names.

Sample code:

    console.log(Object.getOwnPropertyNames(Date))
  // [ 'length', 'name', 'prototype', 'now', 'parse', 'UTC' ]

3、Object.prototype.hasOwnProperty()

The hasOwnProperty method of an object instance returns a Boolean value, which is used to determine whether a property is defined on the object itself or on the prototype chain.

Sample code:

    Date.hasOwnProperty('length') // true
    Date.hasOwnProperty('toString') // false

4. in operator and for...in loop

The in operator returns a Boolean value indicating whether an object has a certain attribute. It does not distinguish whether the property is the object's own property or an inherited property.
Sample code:

 'length' in Date // true
 'toString' in Date // true
 //in运算符常用于检查一个属性是否存在。

 //获得对象的所有可遍历属性(不管是自身的还是继承的),可以使用for...in循环。

      var o1 = {
    
     p1: 123 };

      var o2 = Object.create(o1, {
    
    
        p2: {
    
     value: "abc", enumerable: true }
      });

      for (p in o2) {
    
    
        console.info(p); //p1 p2
      }  

ES6 new:

1、 Object.is()

Object.is is used to compare whether two values ​​are strictly equal, and the behavior is basically the same as the strict comparison operator (===).

let a = {
    
    major:'英语',class:'五年一班'};
let aClone = {
    
     ...a };//使用扩展运算符将对象a的数据复制到aClone1中
console.log(aClone === a); //false
console.log(Object.is(aClone,a)) //false,使用对象上的is进行判断是否相同

2、Object.assign()

The Object.assign() method is used to merge objects and copy all enumerable properties of the source object (source) to the target object (target).
The first parameter of the Object.assign() method is the target object, and the subsequent parameters are the source object.

const target = {
    
     a: 1 };
const source1 = {
    
     b: 2 };
const source2 = {
    
     c: 3,d:4 };
Object.assign(target, source1, source2);
console.log(target);// { a: 1, b: 2, c: 3, d: 4 }
const source = {
    
     a: {
    
     b: 'hello' } }
let obj = Object.assign(target, source)
console.log(obj) //  { a: { b: 'hello' }} key相同时,后出现的value将会覆盖前边的value值
注意:
  1、如果目标对象与源对象有同名属性,或多个源对象有同名属性,则后面的属性会覆盖前面的属性。
  2、Object.assign()方法实行的是浅拷贝,而不是深拷贝。也就是说,如果源对象某个属性的值是对象,
  那么目标对象拷贝得到的是这个对象的引用。

3、Object.getOwnPropertyDescriptors()

ES2017 introduced the Object.getOwnPropertyDescriptors() method, which returns the description object of all its own properties (non-inherited properties) of the specified object.

const obj = {
    
    
  id:123,
  get bar(){
    
    return 'abc'}
};
let obj1 = Object.getOwnPropertyDescriptors(obj)
console.log(obj1)

Output result:

{
  id: { value: 123, writable: true, enumerable: true, configurable: true },
  bar: {
    get: [Function: get bar],
    set: undefined,
    enumerable: true,
    configurable: true
  }
}

4、Object.setPrototypeOf()

The Object.setPrototypeOf method has the same function as __proto__, which is used to set the prototype object (prototype) of an object and return the parameter object itself. It is the officially recommended way of setting prototype objects in ES6.
Grammar format:
Object.setPrototypeOf(object, prototype)
Grammar example:
const o = Object.setPrototypeOf({}, null);
Example:

let proto = {
    
    };
let obj = {
    
    x:10};
Object.setPrototypeOf(obj,proto)
proto.y = 20;
proto.z = 30;
console.log(obj.x) //10
console.log(obj.y) //20
console.log(obj.z) //30
console.log(proto) //{ y: 20, z: 30 }

5、Object.getPrototypeOf()

Object.getPrototypeOf, this method is matched with Object.setPrototypeOf and is used to query and read the prototype object of an object.

Syntax format:
Object.getPrototypeOf(obj);

function Rectangle() {
    
    
  // ...
}

const rec = new Rectangle();

console.log(Object.getPrototypeOf(rec) === Rectangle.prototype);
//输出true 表明rec对象的原型对象和Rectangle的原型对象是一致的
Object.setPrototypeOf(rec, Object.prototype); //将rec的原型对象设置到Object的原型对象上面
console.log(Object.getPrototypeOf(rec) === Rectangle.prototype)
//输出false,表明rec的原型对象重新设置后与Rectangle的原型对象不一样了

6、Object.keys(),Object.values(),Object.entries()

These three methods all convert the keys or values ​​in the object into arrays for traversal. ES2017 introduced Object.values ​​and Object.entries, which are matched with Object.keys, as a supplementary means of traversing an object for use in for...of loops.

6.1 Object.keys()

ES5 introduced the Object.keys method, which returns an array whose members are the key names of all enumerable properties of the parameter object itself (excluding inherited ones).

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

6.2 Object.values()

The Object.values ​​method returns an array whose members are the key values ​​of all enumerable properties of the parameter object itself (excluding inherited ones).

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

6.3 Object.entries()

The Object.entries() method returns an array whose members are an array of key-value pairs (two-dimensional array) of all traversable (enumerable) properties of the parameter object itself (excluding inherited ones).

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

7、Object.fromEntries()

Object.fromEntries() and Object.entries() are matched to convert specific array objects into object format.


const arr = [ [ 'foo', 'bar' ], [ 'baz', 42 ] ]

/*数组对象中的数组只能有两个值,是类似键值对格式的数组,如果有多的将会被忽略不纳入转换
的对象数据中,以前两个数据为准进行数据格式的转换*/
const arr1 = [ [ 'foo', 'bar','obj' ], [ 'baz', 42,'name','jerry' ] ] 
console.log(Object.fromEntries(arr)) //{ foo: 'bar', baz: 42 }
console.log(Object.fromEntries(arr1))//{ foo: 'bar', baz: 42 } 两个数组得到的是一样的

Guess you like

Origin blog.csdn.net/weixin_51033461/article/details/120825483