资讯专栏INFORMATION COLUMN

细数JavaScript中那些神乎其神的技巧

Sleepy / 927人阅读

摘要:闲来无事,整理一下中那些神乎其神的技巧,假装大牛的样子字符串转换为数字同样可用于日期转换为数值数值向下取整字符串转换为数值并取整谢谢开始学习前端指正,该取整直接去除小数点后数字,仅对正数有效函数设置默认值为时最后都得到变量值交换使用

闲来无事,整理一下JavaScript中那些神乎其神的技巧,假装大牛的样子 1. 字符串转换为数字

</>复制代码

  1. var a = "123";
  2. console.log(+a); // 123
  3. console.log(typeof +a); // number
  4. // 同样可用于日期转换为数值:
  5. var b = +new Date(); // 1468545682168
2. 数值向下取整

</>复制代码

  1. var a = ~~3.14; // 3
  2. var b = 3.14>>0; // 3
  3. var c = 3.14|0; // 3
3. 字符串转换为数值并取整

</>复制代码

  1. var a = "3.14"|0; // 3
  2. var b = "3.14"^0; // 3

</>复制代码

  1. 谢谢 @开始学习前端 指正,该取整直接去除小数点后数字,仅对正数有效

4. 函数设置默认值

</>复制代码

  1. function func(arg){
  2. var arg = arg || "default";
  3. // arg 为 undefined, null, "", 0, false, NaN 时最后都得到"default"
  4. }
5. 变量值交换

</>复制代码

  1. var a = 1,
  2. b = 2;
  3. a = [b, b = a][0];
  4. console.log(a); // 2
  5. console.log(b); // 1
6. 使用for in遍历对象取到属性名与属性

</>复制代码

  1. var obj = {
  2. a: 1,
  3. b: 2
  4. }
  5. for(var i in obj) {
  6. console.log("obj." + i + " = " + obj[i]);
  7. }
  8. // output: obj.a = 1
  9. // obj.b = 2
7. 截断数组

</>复制代码

  1. var arr = [1, 2, 3, 4, 5, 6];
  2. arr.length = 3;
  3. console.log(arr); // [1, 2, 3]
8. 提高遍历较大Enumerable数据的性能

</>复制代码

  1. var arr = [1, 2, 3, 4, 5, 6, ...];
  2. var len = arr.length; // 缓存arr.length
  3. for(var i = 0; i < len; i++) {
  4. console.log(arr[i]);
  5. }
  6. // 也可将缓存写在for的声明中
  7. for(var i = 0, len = a.length; i < len; i++) {
  8. console.log(arr[i]);
  9. }
  10. // 或者(!注意:若数组中键值存在undefinednull0false等数据时会中断遍历)
  11. for(var i = 0, a; a = arr[i++];) {
  12. console.log(a);
  13. }
9. 使用 && 替代单一条件判断

</>复制代码

  1. // 你可能这样写过
  2. if(!token) {
  3. login();
  4. }
  5. // 其实这样也可以
  6. !token && login();
  7. // 或
  8. token || login();
10. 检测 对象/数组 中是否有指定 属性/元素

</>复制代码

  1. var CURD = {
  2. add: function() {},
  3. delete: function() {},
  4. edit: function() {}
  5. }
  6. console.log("add" in CURD); // true
  7. console.log("find" in CURD); // false
  8. /* 误 */
  9. // var arr = [1, 2, 3];
  10. // console.log(1 in arr); // true
  11. // console.log(6 in arr); // false

</>复制代码

  1. 谢谢 @zaaack 指正,数组的存在检测实质上是检测的是数组下标

11. 通过闭包调用setTimeout

</>复制代码

  1. for(var i = 0; i < 10; i++) {
  2. setTimeout(function(){
  3. console.log(i); // 10 10 10 ...
  4. },500);
  5. }
  6. for(var i = 0; i < 10; i++) {
  7. (function(i){
  8. setTimeout(function(){
  9. console.log(i); // 0 1 2 3 ...
  10. },500)
  11. })(i);
  12. }
12. To be continue... Started At 函数式编程:柯里化的变型应用 | 熊D博客

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/81095.html

相关文章

  • 细数 JavaScript 实用黑科技(二)

    摘要:前言书接上文细数实用黑科技一本文介绍独孤九剑和两篇最高内功心法。可以将变量转换为布尔值。可以把任何类型的值转换为布尔值,并且只有当这个变量的值为的时候才会返回,其他情况都返回。同样的,函数体内部声明的函数,作用域绑定函数体内部。 showImg(https://segmentfault.com/img/remote/1460000016507838); 前言 书接上文:细数 JavaS...

    马忠志 评论0 收藏0
  • 细数 JavaScript 实用黑科技(一)

    摘要:小汪经过实践得出以下用途。空数组的类型也是,这表示在内部,数组本质上只是一种特殊的对象。调用函数时,某个参数未设置任何值,这时就可以传入,表示该参数为空。前端还是很有未来的下节内容细数实用黑科技二。 showImg(https://segmentfault.com/img/remote/1460000016507838); 前言 只有深入学精一门语言,学其他语言才能更好地举一反三,触类...

    ConardLi 评论0 收藏0
  • 细数你不得不知容器安全工具

    摘要:你首先需要了解的安全工具之一就是。是另一个可为进行安全漏洞扫描的工具。和相似,是的安全审核工具。和其他容器安全工具不同,使用创建自定义配置文件非常容易。月日,北京海航万豪酒店,容器技术大会即将举行。 网络安全问题的重要性大概毋庸置疑,最近无数关于恶意软件和安全漏洞的消息已充分证明了这一点。 假如你要管理一个Docker环境,并希望帮助自己的公司或用户在下一个大漏洞来临时避免遇到麻烦,那...

    刘德刚 评论0 收藏0
  • 细数你不得不知容器安全工具

    摘要:你首先需要了解的安全工具之一就是。是另一个可为进行安全漏洞扫描的工具。和相似,是的安全审核工具。和其他容器安全工具不同,使用创建自定义配置文件非常容易。月日,北京海航万豪酒店,容器技术大会即将举行。 网络安全问题的重要性大概毋庸置疑,最近无数关于恶意软件和安全漏洞的消息已充分证明了这一点。 假如你要管理一个Docker环境,并希望帮助自己的公司或用户在下一个大漏洞来临时避免遇到麻烦,那...

    zhoutk 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<