JavaScriptのオブジェクトのメソッド

JavaScript のオブジェクト メソッドの概要:

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

1、Object.getPrototypeOf(オブジェクト)

Object.getPrototypeOf メソッドは、パラメーター オブジェクトのプロトタイプを返します。これは、プロトタイプ オブジェクトを取得する標準的な方法です。
コード例:

    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)

Object.setPrototypeOf メソッドは、パラメーター オブジェクトのプロトタイプを設定し、パラメーター オブジェクトを返します。2 つのパラメータを受け入れます。1 つ目は既存のオブジェクト、2 つ目はプロトタイプ オブジェクトです。
このメソッドは、 new によって生成されるオブジェクトに似ています
。コード例:

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

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

3、Object.create(オブジェクト)

Object.create() メソッドはオブジェクトをパラメータとして受け取り、それをプロトタイプとして使用してインスタンス オブジェクトを返します。このインスタンスは、プロトタイプ オブジェクトのプロパティとメソッドを完全に継承します
。コード例:

 // 原型对象
      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

注意:
1. create メソッドはオブジェクト プロトタイプを提供する必要があります。パラメータが空であるか、パラメータがオブジェクトではない場合、コードはエラーを報告します。 2. create() メソッドによって生成された新しいオブジェクトは、プロトタイプを動的に継承します
プロトタイプにメソッドを追加または変更すると、新しいオブジェクトにすぐに反映されます。浅いコピーに相当

インスタンスオブジェクトのメソッド:

1、Object.prototype.isPrototypeOf()

インスタンス オブジェクトの isPrototypeOf メソッドは、オブジェクトがパラメータ オブジェクトのプロトタイプであるかどうかを判断するために使用されます。
サンプルコード:

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

上記のコードでは、Object.prototype がプロトタイプ チェーンの最上位にあるため、null を直接継承するオブジェクトを除くすべてのインスタンスに対して true が返されます。

2、Object.getOwnPropertyNames()

Object.getOwnPropertyNames メソッドは、継承されたプロパティ キー名を除く、パラメーター オブジェクト自体のすべてのプロパティのキー名をメンバーとする配列を返します。

サンプルコード:

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

3、Object.prototype.hasOwnProperty()

オブジェクト インスタンスの hasOwnProperty メソッドは、プロパティがオブジェクト自体に定義されているか、プロトタイプ チェーンに定義されているかを判断するために使用されるブール値を返します。

サンプルコード:

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

4. in 演算子と for…in ループ

in 演算子は、オブジェクトに特定の属性があるかどうかを示すブール値を返します。プロパティがオブジェクト自身のプロパティであるか、継承されたプロパティであるかは区別されません。
サンプルコード:

 '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の新機能:

1、Object.is()

Object.is は 2 つの値が厳密に等しいかどうかを比較するために使用され、動作は基本的に厳密比較演算子 (===) と同じです。

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()

Object.assign() メソッドは、オブジェクトをマージし、ソース オブジェクト (source) の列挙可能なすべてのプロパティをターゲット オブジェクト (target) にコピーするために使用されます。
Object.assign() メソッドの最初のパラメータはターゲット オブジェクトで、後続のパラメータはソース オブジェクトです。

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 では、指定されたオブジェクトのすべての独自のプロパティ (非継承プロパティ) の説明オブジェクトを返す Object.getOwnPropertyDescriptors() メソッドが導入されました。

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

出力結果:

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

4、Object.setPrototypeOf()

Object.setPrototypeOf メソッドには __proto__ と同じ機能があり、オブジェクトのプロトタイプ オブジェクト (プロトタイプ) を設定し、パラメーター オブジェクト自体を返すために使用されます。これは、ES6 でプロトタイプ オブジェクトを設定するために公式に推奨されている方法です。
文法形式:
Object.setPrototypeOf(object,prototype)
文法の例:
const o = Object.setPrototypeOf({}, null);
例:

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、このメソッドは Object.setPrototypeOf と一致し、オブジェクトのプロトタイプ オブジェクトをクエリして読み取るために使用されます。

構文形式:
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()

これら 3 つのメソッドはすべて、オブジェクト内のキーまたは値を走査用の配列に変換します。ES2017 では、for...of ループで使用するオブジェクトをトラバースする補助手段として、Object.keys と照合される Object.values と Object.entries が導入されました。

6.1 Object.keys()

ES5 では、Object.keys メソッドが導入されました。このメソッドは、パラメーター オブジェクト自体のすべての列挙可能なプロパティ (継承されたものを除く) のキー名をメンバーとする配列を返します。

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

6.2 Object.values()

Object.values メソッドは、パラメーター オブジェクト自体のすべての列挙可能なプロパティ (継承されたものを除く) のキー値をメンバーとする配列を返します。

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

6.3 Object.entries()

Object.entries() メソッドは、パラメーター オブジェクト自体 (継承されたものを除く) のすべての走査可能な (列挙可能な) プロパティのキーと値のペアの配列 (2 次元配列) をメンバーとする配列を返します。

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

7、Object.fromEntries()

Object.fromEntries() と Object.entries() を照合して、特定の配列オブジェクトをオブジェクト形式に変換します。


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 } 两个数组得到的是一样的

おすすめ

転載: blog.csdn.net/weixin_51033461/article/details/120825483