推荐30个JavaScript技巧写法（一）

1、使用!!转为布尔值

let a = !!1; // true
let b = !!0; // false

02默认功能参数

function greet(name = 'Guest') {
  return `Hello, ${ name }`;
}

03使用三元运算符

let price = 100;
let message = price > 50 ? 'Expensive' : 'Cheap';

04动态字符串的模板文字

let item = 'coffee';
let price = 100;
console.log(`One ${item} costs ￥${price}`);

05解构赋值

let [x, y] = [1, 2];
let {name, age} = { name: 'Alice', age: 30 }

06扩展运算符的克隆或合并

let arr1 = [1, 2, 3];
let arr2 = [4, 5, 6];
let cloneArray = [...arr1, ...arr2];

07短路判断

let isValid = true;
isValid && console.log('Valid!')

08 可选链(?.)

let user = {name: 'John', address: {city: 'Shang Hai'}};
console.log(user?.address?.city) //Shang Hai

09 空合并运算符（??）

let username = null;
console.log(username ?? "Guest")

10 map、filter和reduce进行数组操作

//map
let numbers = [1, 2, 3, 4];
let doubled = numbers.map(x => x * 2);

// filter
const evens = numbers.filter(x => x % 2 === 0);

// reduce
const sum = numbers.filter((accumulator, currentValue) => accumulator + currentValue, 0);

11 标记模板文字

function highlight(strings, ...values) {
    return strings.reduce((prev, current, i) => `${prev}${current}${values[i]} || ''`, '');
}
let price = 10;
console.log(highlight`The price is ${price} dollars.`);

12 使用Object.entries()和Object.fromEntries()

let person = {name: 'Alice', age: 30};
let entries = Object.entries(person);
let newPerson = Object.fromEntries(entries);

13 唯一元素的集合对象

let nembers = [1, 2, 3, 4];
let uniqueNumbers = [...new Set(numbers)];

14 对象中的动态属性名称

let dynamicKey = 'name';
let person = {[dynamicKey]: 'Alice'};

15 使用bind()进行函数柯里化

function multiply(a, b) {
    return a * b;
}
let double = multiply.bind(null, 2);
console.log(double(5)); // 10