es6中的assign怎么用

本篇內容介紹了“es6中的assign怎么用”的有關知識，在實際案例的操作過程中，不少人都會遇到這樣的困境，接下來就讓小編帶領大家學習一下如何處理這些情況吧！希望大家仔細閱讀，能夠學有所成！

在es6中，assign用于對象的合并，可以將源對象的所有可枚舉屬性復制到目標對象；若目標對象與源對象有同名屬性，或多個源對象有同名屬性，則后面的屬性會覆蓋前面的屬性，語法為“Object.assign(...)”

本教程操作環境：windows10系統、ECMAScript 6.0版、Dell G3電腦。

es6中assign的用法是什么

Object.assign方法用于對象的合并，將源對象（source）的所有的可枚舉屬性（key:value）復制到目標對象（target）

例如：

        const target = { a : 1 };
        const  source1 = { b: 2 };
        const  source2 = { c: 3 };
Object.assign(target,source1,source2)      // target { a:1, b:2, c:3 }

注意： 如果目標對象與源對象有同名屬性，或者多個源對象有同名屬性，則后面的屬性會覆蓋前面的屬性。

例如：

    const target  = {a:1,b:1};
    const source1 = { b: 2,c:2};
    const source2 = {c:3};
 Object.assign(target,source1,source2); // target {a:1,b:2,c:3}

如果只有一個參數，Object.assign會直接返回改參數,如果參數不是對象則會先轉出對象，然后在返回,由于null 與 undefined 無法轉換為對象，所以如果他們作為參數就會報錯。如果非對象參數出現在源對象的位置（意思是不是第一個參數），那么處理規則有所不同。首先，這些參數都會轉成對象，如果出現null 或者undefined只要保證不再首個參數就不會報錯。

例如：

   const obj = {a:1},
   Object.assign(obj)  === obj   // true   
   typeof  Object.assign(2)    // object
   Object.assign(undefined)  // 報錯
   Object.assign(null)   // 報錯
   Object.assign(obj,undefined)

其他類型的值（即數值、字符串和布爾值）不在首參數，也不會報錯，但是字符串會以數組的形式，拷貝入目標對象，其他值都不會產生效果。

    const v1 = 'abc';
    const v2 = true;
    const v3 = 10;
    const objCurrent = Object.assign({},v1,v2,v3);  // {0:'a',1:'b',2:'c'}; 
    // 上面代碼中,v1,v2,v3分別是字符串、布爾值、數值，結果只有字符串符合目標對象（以字符串數組的形式），數值與布爾值都會被忽略。這是因為只有字符串的包裝對象，會產生枚舉屬性。
Object.assign()的深淺拷貝問題
    const obj1 = {a: 1};
    const obj2 = {b: 2};
    const obj3 = {c: 3};
    const obj = Object.assign(obj1,obj2,obj3);
    console.log(obj);   //  {a:1,b:2,c:3}
    console.log(obj1);   //   {a:1,b:2,c:3}  原始對象也被改變啦
    const v1 ={a:1},
    const currentObj = Object.assign(JSON.parse(JSON.stringify(v1)),{e:2})
    console.log(currentObj)  // {a:1,e:2}
    console.log(v1) // {a:1} 并沒有發生變化

當對象中只有一級屬性，沒有二級屬性的時候，此方法為深拷貝，但是對象中有對象的時候，此方法在二級屬性以后就是淺拷貝。

使用遞歸的方式實現深拷貝

    // _deep 深度拷貝的方法
    function  _deep(source){
        let  target;
        if (typeof source === 'object'){
            // 判斷目標值是數組還是對象
            target = Array.isArray(source) ? []: {}
            for (let key in source) {
                // 指示對象自身屬性中是否含有指定的屬性
                if(source.hasOwnProperty[key]){
                      // 如果屬性不是對象則賦值，負責遞歸
                      if(typeof source[key] !== 'object'){
                            target[key] = source[key]
                      }else {
                            target[key] = _deep(source[key])
                      }
                }
            }
        } else {
           target = source
        }
        // 返回目標值
        return  target 
    }

使用js實現深拷貝

    function _deepJs(_data){
        return JSON.parse(JSON.stringify(_data));
    }

“es6中的assign怎么用”的內容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業相關的知識可以關注億速云網站，小編將為大家輸出更多高質量的實用文章！