有哪些短小却令人惊叹的javascript代码

在项目的开发过程中，我们可以使用一些看似短小但功能却很强大的代码来帮助我们解决一些问题。那么我们就来看看都有哪些短小却令人惊叹的代码呢？

 

第1个功能：数组去重。

实现方案1：

思路：对待去重的数组arr进行for循环遍历，然后在新的数组newArr中去查找当前被遍历的元素arr[i]，如果返回值为-1，说明在新的数组中还没有出现过当前被遍历的元素arr[i]，则把该元素放到新的数组中。当数组arr遍历完以后，新数组newArr就是去重以后的数组。

var arr = [1, 4, 7, 4, 3, 2, 1, 4, 7];
var newArr = [];
for(var i = 0; i < arr.length; i++) {
if(newArr.indexOf(arr[i]) === -1) {
newArr.push(arr[i]);
}
}
console.log(newArr);

实现方案2：

思路：该方案和方案1思路相同，只不过是使用reduce方法进行遍历。

var arr = [1, 4, 7, 4, 3, 2, 1, 4, 7];
var newArr = arr.reduce((newArr, current) => {
if(newArr.indexOf(current) === -1) {
newArr.push(current);
}
return newArr;
}, []);
console.log(newArr);

实现方案3：

思路：当前方案使用了ES6新增的set数据解构的去重特性，然后在将生成的set对象转换成数组。

var arr = [1, 4, 7, 4, 3, 2, 1, 4, 7];
var newArr = Array.from(new Set(arr));
console.log(newArr);

第2个功能：在数组中找出最小值（或者最大值）。

实现方案1：

思路：假设第一个数组元素是最小值，然后对数组后面的元素进行遍历、判断，如果当前被遍历的元素小于iMin变量的值，说明iMin变量的值还不是最小值，则将当前遍历的元素值替换掉iMin变量的值。当循环结束，iMin变量的值就是数组中最小的值。

var arr = [23, 45, 40, 30, 12];
var iMin = arr.shift();
arr.forEach((v) => {
iMin = v < iMin ? v : iMin;
});
console.log(iMin);

实现方案2：

思路：利用Math.min()方法求最小值，但是该方法的参数是一个数值列表，而不是一个数组，故使用ES6新增的扩展运算符将数组转换成列表，然后传递到Math.min()方法中去即可。

var arr = [23, 45, 40, 30, 12];
var iMin = Math.min(...arr);
console.log(iMin);

第3个功能：交换两个变量的值。

实现方案1：

思路：将变量a的值给到临时变量temp，然后再将变量b的值给变量a，最后再将临时变量temp的值给变量b，至此完成变量a和变量b交换值的功能。

var a = 4, b = 6;
var temp = a;
a = b;
b = temp;
console.log(a , b);

实现方案2：

思路：利用ES6的数组解构方法，实现在不使用第三个变量的情况下，完成变量a和变量b的数据交换。

var a = 4, b = 6;
[a, b] = [b, a];
console.log(a, b);

好啦，这次我们先介绍这个三个功能。通过这三个功能的编程实现，我们不难发现，如果想要写出短小却又令人惊叹的代码，并不是一蹴而就的，需要有扎实的编程基础和一定的编程经验。

纸上得来终觉浅，绝知此事要躬行。加油吧，骚年！

来源：千锋HTML5