在JavaScript構造函數中傳遞鍵/值對象作爲參數

Question

我設置了一個對象構造函數，並希望將一個鍵/值對象作爲參數傳遞。我想知道什麼纔是正確的方法呢？現在，我只是路過的鍵作爲參數：

(function() { 
    function Venue(name, poor, satisfactory, excellent) { 
     this.name = name; 
     this.serviceRatings = { 
      poor: poor, 
      satisfactory: satisfactory, 
      excellent: excellent 
     }; 
    } 

    var dining = new Venue("dining", .1, .15, .2); 

    console.log(dining["serviceRatings"]["satisfactory"] // .15 
}()); 

雖然這部作品，從一個Ruby的背景的，只覺得不對傳遞對象本身，並在初始化分配它的值。這是我能想到的最好的等價物：

class Venue 
    def initialize(name, serviceRatings = {}) 
    @name = name 
    @poor = serviceRatings[:poor] 
    @satisfactory = serviceRatings[:satisfactory] 
    @excellent = serviceRatings[:excellent] 
    end 
end 

有沒有辦法在Javascript中做到這一點？我現在寫的東西的方式讓我感覺好像我膨脹我的constructer的參數列表（除非這個是正確的方式來做到這一點）。

Answer 1

你可以傳遞一個對象，就像你在ruby類中做的那樣。

function Venue(name, options) { 
    this.name = name; 
    this.serviceRatings = options; 
} 

var dining = new Venue("dining",{ 
     poor: .1, 
     satisfactory: .15, 
     excellent: .2 
    }); 

上面將創建與以前相同的輸出。值得一提的是2015年的ECMAScript帶來類的JavaScript - 所以你也可以寫這樣的：

class Venue { 
    constructor(name, options = {}) { 
     this.name = name; 
     this.serviceRatings = options; 
    } 
} 

上面我們使用一個空的對象作爲default parameter，這也是一個ES2015功能。

如果你想擁有默認鍵名，像這樣將使其

class Venue { 
    constructor(name, options = {}) { 
     this.name = name; 
     this.serviceRatings = Object.assign({ 
      poor: undefined, 
      satisfactory: undefined, 
      excellent: undefined 
     }, options); 
    } 
} 

Answer 2

參數將包含作爲列表傳遞給函數的所有參數。

(function() { 
    function Venue() { 
     console.log(arguments); 
    } 

    var dining = new Venue("dining", .1, .15, .2); 

}()); 

Answer 3

你的意思是這樣嗎？

(function() { 
     function Venue(name, serviceRatings) { 
      this.name = name; 
      this.serviceRatings = serviceRatings; 
     } 

     var dining = new Venue("dining", { 
      poor:.1, 
      satisfactory:.15, 
      excellent:.2 
     }); 

     console.log(dining["serviceRatings"]["satisfactory"]) // .15 
    }()); 

Answer 4

正如其他人所指出的，可以傳遞一個對象作爲參數。

// naive ES5 version 
function Venue(name, serviceRatings) { 
    this.name = name; 
    this.serviceRatings = serviceRatings; 
} 

這種天真的方法的問題是JavaScript中的對象是可變的。如果您像上面那樣分配對象，則您的對象狀態可能會意外發生變異。例如：

var ratings = { poor: 0, satisfactory: 2, excellent: 8 }; 
var diner = new Venue('diner', ratings); 

ratings.poor = 12; 
var burgerJoint = new Venue('my burgers', ratings); 

在這裏，您變異評級食客創建後，和你不小心設置diner.serviceRatings.poor至12

您可以通過複製你的對象的值，保護您的代碼如下： Object.assign（）將每個屬性從seviceRatings複製到{};}。這種方式後來修改其他對象不會影響您的成員屬性。

如果您使用的是ES2015，您可以使用對象解構，它有其他好處：它使您的預期數據結構清晰;並允許你指定默認值：

// ES2015 version with explicit parameters and default values 
function Venue(name, { poor = 0, satisfactory = 0, excellent = 0 }) { 
    this.name = name; 
    this.serviceRatings = { poor, satisfactory, excellent }; 
} 

編輯：作爲另一個答案看到，如果你使用的ES2015，您可能會以及使用類的語法糖：

// ES2015 version using class definition 
class Venue 
    constructor (name, { poor = 0, satisfactory = 0, excellent = 0 }) { 
     this.name = name; 
     this.serviceRatings = { poor, satisfactory, excellent }; 
    }  
}