使用函數過濾并序列化對象：

JSON.stringify函數：

value：將要被序列化的變量的值 replacer：替代器?？梢允呛瘮祷蛘呤菙到M如果是一個函數，則 value 每個屬性都要經過這個函數的處理，該函數的返回值就是最后被序列化后的值。如果是一個數組，則要求該數組的元素是字符串，且這些元素會被當做 value 的鍵（key）進行匹配，最后序列化的結果，是只包含該數組每個元素為 key 的值。 space：指定輸出數值的代碼縮進，美化格式之用，可以是數字或者字符串。JSON.stringify(value[, replacer [, space]]) // 方法一： 使用“函數”當替代器 function replacer(key, value) {if (typeof value === "string") {return undefined;}return value; }var foo = {foundation: "Mozilla", model: "box", week: 45, transport: "car", month: 7 }; var jsonString = JSON.stringify(foo, replacer);// {"week":45,"month":7}

如果只是去除對象里面的屬性，可以使用前面我講的ES6的定義方法。

// 方法二： 使用“數組”當替代器 const user = {name: 'zollero',nick: 'z',skills: ['JavaScript', 'CSS', 'HTML5'] }; JSON.stringify(user, ['name', 'skills'], 2);// "{ // "name": "zollero", // "skills": [ // "JavaScript", // "CSS", // "HTML5" // ] // }"

---

用塊級作用域避免命名沖突

在開發的過程中，通常會遇到命名沖突的問題，就是需要根據場景不同來定義不同的值來賦值給同一個變量。下面介紹一個使用 ES6 中的 塊級作用域 來解決這個問題的方法。

switch (record.type) {case 'added': {const li = document.createElement('li'); //第一處li.textContent = record.name;li.id = record.id;fragment.appendChild(li);break;}case 'modified': {const li = document.getElementById(record.id); //第二處li.textContent = record.name;break;} }

---

函數參數值校驗

function fix(a = getA()) {console.log('a', a) }function getA() {console.log('get a')return 2 }fix(1); // a 1fix(); // get a // a 2

可以看出，如果在調用 fix 時傳了參數 a ，則不會執行函數 getA，只有當不傳遞參數 a 時，才會執行函數 getA。

使用場景：

function fix(a = require()) {console.log('a', a) }function require() {throw new Error('缺少了參數 a') }fix(1); // a 1fix(); // Uncaught Error: 缺少了參數 a

這里加入參數沒有傳遞a 的值的話，就會進入 報錯函數。

---

用解構賦值過濾對象屬性

// 我們想過濾掉對象 types 中的 inner 和 outer 屬性 const { inner, outer, ...restProps } = {inner: 'This is inner',outer: 'This is outer',v1: '1',v2: '2',v4: '3' }; console.log(restProps); // {v1: "1", v2: "2", v4: "3"}

---

用解構賦值獲取嵌套對象的屬性

解構賦值 的特性很強大，它可以幫我們從一堆嵌套很深的對象屬性中，很方便地拿到我們想要的那一個。比如下面這段代碼：

// 通過解構賦值獲取嵌套對象的值 var car = {model: 'bmw 2018',engine: {v6: true,turbo: true,vin: 12345} }; // 這里使用 ES6 中的簡單寫法，使用 { vin } 替代 { vin: vin } var modalAndVIN = ({ model, engine: { vin }}) => {console.log(`model: ${model}, vin: ${vin}`); }modalAndVIN(car); // "model: bmw 2018, vin: 12345"

這里可以將獲取對象的嵌套屬性，可以拼接成新的對象。

---

合并對象

// 使用拓展運算符合并對象，在后面的屬性會重寫前面相同屬性的值 const obj1 = { a: 1, b: 2, c: 3 }; const obj2 = { c: 5, d: 9 }; const merged = { ...obj1, ...obj2 }; console.log(merged); // {a: 1, b: 2, c: 5, d: 9}const obj3 = { a: 1, b: 2 }; const obj4 = { c: 3, d: { e: 4, ...obj3 } }; console.log(obj4); // {c: 3, d: {a: 1, b: 2, e: 4} }

---

使用 === 代替 ==

在 JavaScript 中，== 會將兩邊的變量進行轉義，然后將轉義后的值進行比較，而 === 是嚴格比較，要求兩邊的變量不僅值要相同，它們自身的類型也要相同。

[10] == 10 // true [10] === 10 // false'10' == 10 // true '10' === 10 // false[] == 0 // true[] === 0 // false'' == false // true'' === false // false

ES6 中提供了一個新的方法：Object.is()，它具有 === 的一些特點，而且更好、更準確，在一些特殊場景下變現的更好：

Object.is(0 , ' '); //false Object.is(null, undefined); //false Object.is([1], true); //false Object.is(NaN, NaN); //true

刪除一個字符串的最后一個元素

var basic = "abc12345678,";basic = basic.substring(0, basic.length - 1);

總結

以上是生活随笔為你收集整理的JavaScript 中的代码小技巧的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。