3、Object 對象經常使用操做方法

Object 構造方法

1、asign vs 擴展運算符 ...

1.共同點：都是淺拷貝

2.開發推薦 擴展運算符...

let obj={
  name: 'Tom',
  age: 18
};
let obj1={
  name: 'Jack',
  age: 15,
}
let obj2 = Object.assign({},obj, obj1);
let obj3 = {...obj1, ...obj2};
console.log(obj2); // { name: 'Jack', age: 15 }
console.log(obj3); // { name: 'Jack', age: 15 }

View Code

2、create 

Object.create()方法建立一個新對象，使用現有的對象來提供新建立的對象的__proto__。 

將現有對象做新對象的 __proto__;

class Animal {
  constructor(name,age){
    this.name= name;
    this.age=age;
  }
  run(){
    console.log('動物會跑');
  }
}
class Dog extends Animal{
  constructor(name,age){
    super(name,age)
  }
  bark(){
    console.log('狗會叫');
  }
}
let dog = new Dog('taidi',10);
console.log(dog);
let dog1 = Object.create(dog);
console.log(dog1);

View Code

3、defineProperty

 4、for in keys values entries

1.for in 會遍歷原型上的方法

function Person(){
  this.name= 'jack';
  this.age=18;
}
Person.prototype.height=180;
Person.prototype.weight=75;
Person.prototype.run=function(){
  console.log('jack 在跑步');
}

let p = new Person();
console.log(p);
/*
Person {name: "jack", age: 18}
age: 18
name: "jack"
__proto__:
height: 180
run: ƒ ()
weight: 75
constructor: ƒ Person()
__proto__: Object
*/
for(key in p){  // for in 會遍歷原型上的方法
  console.log(key); // name age height weight run
}
console.log(Object.keys(p));  // ["name", "age"] 返回一個新的數組，不會遍歷原型上的方法
console.log(Object.values(p));  // ["jack", 18] 返回一個新的數組，不會遍歷原型上的方法
console.log(Object.entries(p)); // [ [ 'name', 'jack' ], [ 'age', 18 ] ]

View Code

5、getPrototypeOf

Object.getPrototypeOf() 方法返回指定對象的原型

返回對象的原型

function Person(name,age){
   this.name = name;
   this.age = age;
}

Person.prototype.height=180;
Person.prototype.weight=60;

const p = new Person('jack',18);
console.log(Object.getPrototypeOf(p));

View Code

經典：判斷是不是 plain object

/**
 * @param {any} obj The object to inspect.
 * @returns {boolean} True if the argument appears to be a plain object.
 */
export default function isPlainObject(obj) {
  if (typeof obj !== 'object' || obj === null) return false

  let proto = obj
  while (Object.getPrototypeOf(proto) !== null) {
    proto = Object.getPrototypeOf(proto)
  }

  return Object.getPrototypeOf(obj) === proto
}

View Code

Oject prototype 方法

1、hasOwnProperty

hasOwnProperty()方法用來判斷某個對象是否含有指定的自身屬性

用於檢查給定的屬性在當前對象實例中（而不是在實例原型中）是否存在

重點： for in vs hasOwnProperty

for in  會遍歷出對象繼承中的可枚舉屬性

View Code

遍歷對象自有屬性

function Person(){
  this.name='tom'; this.age=18; } Person.prototype.height = 180; let p = new Person(); for( let key in p){ if(p.hasOwnProperty(key)){ console.log("自身屬性："+key);// name ,age }else{ console.log("繼承別處的屬性："+key);// height  } }

 2、isPropertyof

isPrototypeOf是用來判斷要檢查其原型鏈的對象是否存在於指定對象實例中，是則返回true，不然返回false。

isPrototypeOf vs instanceof

1.instanceof

object1.isPrototypeOf(Object2);（構造函數） : 用於判斷object2的構造函數的object1是否在A的原型鏈上

2.isPropertyof

object1.isPrototypeOf(Object2); ： 用於判斷object1是否在object2的原型鏈上；

View Code

View Code

 3、toString 

let obj= {};

console.log(obj.toString()); // [object Object]