js｜N个实用的JavaScript技巧

数字分隔符

const largeNumber = 9_999_999
console.log(largeNumber) 	// 9999999

addEventListener中的once选项

element.addEventListener('click', () => console.log('I run only once'), {
    once: true
}); 

Console.log的时候顺便加个{}

const largeNumber = 9_999_999
console.log({largeNumber}) 	// {largeNumber:9999999}

获取数组中的最大/小值

const numbers = [6, 8, 1, 3, 9];

console.log(Math.max(...numbers)); // 9
console.log(Math.max.apply(null, numbers);)
console.log(Math.min(...numbers)); // 1   
console.log(Math.min.apply(null, numbers);)

利用length截取数组

const numbers = [1, 2, 3, 4, 5];

numbers.length = 3;

console.log(numbers); // [1, 2, 3]; 

短路条件

if (condition) {
    doSomething();
}
||
condition && doSomething(); 

删除数组中重复的元素

const numbers = [2, 3, 4, 4, 2];

console.log([...new Set(numbers)]); // [2, 3, 4] 

console.log的样式

元素的数据集

<div id="user" data-name="zmheang" data-age="27" data-something="go">
 zmheang
</div>

<script>
  const user = document.getElementById('user');
  
  console.log(user.dataset); 
  // { name: "zmheang", age: "27", something: "go" }
  
  console.log(user.dataset.name); // "zmheang"
  console.log(user.dataset.age); // "27"
  console.log(user.dataset.something); // "zmheang"
</script>