js通過方法返回對象的注意點

• 2019 年 10 月 17 日
• 筆記

問題：js通過方法返回一個字面量對象和返回一個提前已經定義好的字面量對象有區別嗎？

答案：有

我們先來看看第一種情況，fun1方法返回一個提前沒定義的字面量對象，然後通過調用方法返回三個對象，分別是obj1, obj2, obj3,然後我修改obj2對象的age方法，列印obj1, obj2, obj3,的age屬性分別是什麼？

 1 //第一種情況：   2         function fun1() {   3   4             return {   5                 uname: `ash`,   6                 age: 18   7             }   8             //這裡返回一個字面量對象，   9             //每次返回的不是同一對象地址，所以改變obj2的age屬性，obj1，obj3,age屬性是不會有影響的  10         }  11         obj1 = fun1();  12         obj2 = fun1();  13         obj3 = fun1();  14         obj2.age = 16;  15         console.log(obj1.age);  16         console.log(obj2.age);  17         console.log(obj3.age);

列印結果 ：

obj1.age = 18   

obj2.age = 16  

 obj3.age = 18

為什麼戶出現這樣的結果呢？因為fun1每次返回的不是同一對象地址，所以改變obj2的age屬性，obj1，obj3,age屬性是不會有影響

再看第二種情況，我先定義好obj3，通過fun2()方法返回這個對象，現在我調用fun2方法，返回obj21  obj22 obj23 對象，修改obj22對象的age屬性為16，分別列印obj21  obj22 obj23  對象的age屬性

 1 //第二種情況：   2         var obj3 = {   3             uname: `ash`,   4             age: 18   5         };   6   7         function fun2() {   8             return obj2;   9         }  10         obj21 = fun2();  11         obj22 = fun2();  12         obj23 = fun2();  13         obj2.age = 16;  14         console.log(obj21.age);  15         console.log(obj22.age);  16         console.log(obj23.age);