js中onClick([object object])的傳參問題
同事找到一個 js 樹形 table 的插件，通過閱讀源碼，發現該插件實現的主要原理就是對樹結構的數據進行遍歷，然後字符串拼接 html 標籤，最後顯示在頁面上。對於table肯定是有行操作的，所以我們在拼接按鈕代碼處添加了一個 run 方法，並且傳遞了一個對象。但是，當頁面加載 dom 元素後，發現 run 方法中的參數居然是 onclick=“run([object Object])”，這樣點擊事件肯定是不能正常執行了。然後通過仔細研究，找到了解決辦法。
第一次嘗試，調用 js 的 toString 方法，把自定義對象轉化成字符串。
但是在瀏覽器中調試 dom 節點，發現依然是 onclick=“run([object Object])”，然後就查找資料詳細瞭解下 [object Object] 是怎麼出來的。
js 中 toString 方法的作用是返回一個反映這個對象的字符串，可參考下表：
| 類型 | toString |
|---|---|
| Object | 返回"[object Object]" |
| stringObject | 返回字符串 |
| NumberObject | 把一個 Number 對象轉換爲一個字符串，並返回結果。 |
| booleanObject | 把一個邏輯值轉換爲字符串，並返回結果。 |
| arrayObject | 把數組轉換爲字符串，用逗號間隔，並返回結果 |
| dateObject | 把 Date 對象轉換爲字符串，並返回結果 |
所以，明白了自定義對象調用js 的 toString 方法，返回的不是對象序列化後的字符串，而是 [object Object] 字符串。這是因爲自定義對象沒有重寫 toString 方法。
第一次嘗試，調用 JSON.stringify 方法，對參數序列化
通過調用 JSON.stringify 方法，我們發現頁面加載的 dom 上 run 方法中的參數顯示是正常的。在查找資料的過程中，提示說在接受參數的時候，需要用 JSON.parse 將 JSON.stringify 序列化的字符串轉換爲對象。但是在實際操作中，我的 run 方法中並沒有調用 JSON.parse 方法，依然可以對接收的參數使用對象方法獲取屬性。
後來反思了一下這個疑惑點：我們知道，如果是單獨傳一個字符串參數，我們是需要加 / 加引號對其轉譯，反觀 JSON.parse 序列化之後的字符串，正是自定義對象本身的數據結構。那就是說，JSON.parse 是對特殊符號進行了轉譯。假如我們手動進行傳參特殊符號的轉譯，那也是成功的，也就是說，轉譯之後其實還是一個對象，所以在接收參數的時候，還是可以用對象方法獲取屬性值。
爲什麼會出現 onClick([object object])
出現這種情況，就是我們渲染 dom 節點的時候，是用的字符串拼接形式。所以，對於 onclick 事件中的參數，我們也因該轉化成字符串的形式進行拼接。如果傳入一個 js 自定義對象，那渲染後的頁面上的 dom 就會出現 onClick([object object]) 這種形式。