189 8069 5689
这篇文章主要讲解了“好用JavaScript技巧有哪些”，文中的讲解内容简单清晰，易于学习与理解，下面请大家跟着小编的思路慢慢深入，一起来研究和学习“好用JavaScript技巧有哪些”吧！
创新互联公司是一家专业从事成都网站建设、做网站、网页设计的品牌网络公司。如今是成都地区具影响力的网站设计公司,作为专业的成都网站建设公司,创新互联公司依托强大的技术实力、以及多年的网站运营经验,为您提供专业的成都网站建设、营销型网站建设及网站设计开发服务！
1.获取数组的最后一项
设置起始参数和终止参数时，Array.prototype.slice(begin,end)具有剪切数组的功能。但是，如果未设置终止参数，该功能将自动设置为数组的最大值。
该功能可接受负值，我想很多人对此并不了解，而且如果将起始参数设定为负数，那么会得到数组的最后几个元素：
vararray = [1,2,3,4,5,6]; console.log(array.slice(-1)); // [6] console.log(array.slice(-2)); // [5,6] console.log(array.slice(-3)); // [4,5,6]
2.用||运算符默认某值
目前的ES6有默认参数功能。为了在旧版浏览器中模拟该功能，你可以用||(OR运算符)默认某值，将其作为第二个可用的参数。
如果第一个参数返回到了false，那么第二个参数就会被视为默认值。请看这个例子：
function User(name, age) { this.name = name || "OliverQueen"; this.age = age || 27; }var user1 = new User(); console.log(user1.name); // Oliver Queen console.log(user1.age); // 27var user2 = new User("Barry Allen", 25); console.log(user2.name); // Barry Allen console.log(user2.age); // 253.重组数组元素
想不用Lodash这样的外部工具库就能重组数组元素?试试下面这个神奇的函数：
var list= [1,2,3]; console.log(list.sort(function() { Math.random() - 0.5 })); // [2,1,3]4.短路条件
如果你看到一个代码类似于：
if (connected) { login(); }可以通过结合使用变量(会被验证)和函数之间的&&(AND运算符)来缩短上述代码。比如，上述代码可以缩短为一行：
connected && login();
你可以执行相同操作来检查对象中是否存在属性或函数。与以下代码类似：
user && user.login();
5.截取数组
这项技巧可以锁定数组的大小，能够根据你要设置的元素数目从数组中删除某些元素，十分有用。
比如，如果有一个含有10个元素的数组，但是你只想要
前五个，那就可以截取数组，通过设置array.length=5让它变小。请看下面的例子：
var array = [1,2,3,4,5,6]; console.log(array.length); // 6 array.length = 3; console.log(array.length); // 3 console.log(array); // [1,2,3]
6.用+运算符转换为数字
这种技巧真是太棒了!它操作起来非常简单，不过只适用于str函数，否则它会返回到NaN(非数字)。请看下面的例子：
functiontoNumber(strNumber) { return +strNumber; }console.log(toNumber("1234")); // 1234 console.log(toNumber("ACB")); // NaN这种技巧同样适用于日期，在这种情况下，它会返回到时间戳：
console.log(+new Date()) //1461288164385
7.合并数组
如果需要将两个数组合并，那么可以用Array.contat()函数：
var array1 = [1,2,3]; var array2 = [4,5,6]; console.log(array1.concat(array2)); // [1,2,3,4,5,6];
但是，该函数并不是合并大型数组比较好的工具，因为它创建新数组时会占用大量内存。
在这种情况下，可以用Array.push.apply(arr1, arr2)，而不用创建新数组。这种函数会将第二个数组并入第一个数组，不会占用太多内存：
vararray1 = [1,2,3]; var array2 = [4,5,6]; console.log(array1.push.apply(array1, array2)); // [1,2,3,4,5,6];
8.在循环中缓存array.length
这个技巧很简单，但在循环中处理大型数组时，它会对性能产生很大影响。为了迭代数组，几乎每个人都会同时写出这样的代码：
for(vari = 0; i < array.length; i++) { console.log(array[i]); }如果处理的是小型数组，那没问题，可是如果处理的是大型数组，那么代码会在循环的每一次迭代中重新计算数组的大小，从而造成延迟。
为了避免此种情况，可以将要用的array.length缓存在某个变量中，而不用在循环的每一次迭代中都调用它：
var length = array.length; for(var i = 0; i < length; i++) { console.log(array[i]); }想让它变短一些?这样写就可以：
for(var i = 0, length = array.length;i < length; i++) { console.log(array[i]); }9.全部替换
String.replace()函数允许使用字符串和正则表达式替换字符串;在本机中该函数只能替换第一次。但是可以在正则表达式的末尾使用/g，从而模拟replaceAll()函数：
varstring = "john john"; console.log(string.replace(/hn/, "ana")); // "joana john" console.log(string.replace(/hn/g, "ana")); // "joana joana"
10.用!!运算符转换为布尔值
有时候，为将变量看作真值，我们需要检查一个变量是否存在或是否具有有效值。在此验证过程中，你可以用!!(双重否定运算符)。
一个简单的!!variable会自动将数据转换为布尔值，而且该变量只有在含有0、null、""、undefined或NaN这样的值时才会返回到false，否则会返回到true。
为了在实践中理解这一过程，我们来看一看下面这个简单的例子：
function Account(cash) { this.cash = cash; this.hasMoney = !!cash; } var account = new Account(100.50); console.log(account.cash); // 100.50 console.log(account.hasMoney); // true var emptyAccount = new Account(0); console.log(emptyAccount.cash); // 0 console.log(emptyAccount.hasMoney); // false该例中，如果account.cash的值大于零，那么account.hasMoney就是true。
11.将NodeList转换为Arrays
如果运行document.querySelectorAll("p")函数，那么它有可能会返回到DOM元素数组，即NodeList对象。但是该对象并不具有数组的全部函数，比如sort()、reduce()、map()和filter()。
为了运行以上函数以及其他自带的数组函数，需要将NodeList转化为Arrays。想试试这个技巧?用下面这个函数就可以：[].slice.call(elements):
var elements = document.querySelectorAll("p");// NodeList var arrayElements = [].slice.call(elements); // Now the NodeList is an array//This is another way of converting NodeList to Arrayvar arrayElements =Array.from(elements);感谢各位的阅读，以上就是“好用JavaScript技巧有哪些”的内容了，经过本文的学习后，相信大家对好用JavaScript技巧有哪些这一问题有了更深刻的体会，具体使用情况还需要大家实践验证。这里是创新互联，小编将为大家推送更多相关知识点的文章，欢迎关注！