我的个人博客:http://www.xiaolongwu.cn

在平时的开发中,编码技巧很重要,会让你少写很多代码,起到事倍功半的效果。

下面总结几种简单的技巧,大家共同学习一下

1、 利用+、-、/1,*1将字符串转换为整数型

这个方法试用于将字符串类型的数字转换为整数型,如果带字母就会返回NaN。

var a = "1234", b = "leonWuv";
//我们想把a转换为1234的整数型,一般方法
console.log(typeof Number(a)) //number
//简单写法
console.log(+a + 1,typeof +a); //1235 number
console.log(a - 0 + 1,typeof (a-0)); //1235 number
console.log(a*1 + 1,typeof (a*1)); //1235 number
console.log(a/1 + 1,typeof (a/1)); //1235 number
console.log(b/1 + 1,typeof (b/1)); //NaN number

这个也是用于 Date();它将返回时间戳

//以下方法都返回时间戳
console.log(+ new Date()); //1512378253218 2017年12月04日17时左右;
console.log(Date.parse(new Date())); //1512378253000 注意后三位向下取整为000;
console.log(new Date("2017/1/1").getTime()); ////1483200000000

2、利用!!强制转换布尔值

我们需要验证一个变量是否存在或者有效时,可以使用!!来简单快速的判断

这个技巧我在 javaScript数据类型你都弄明白了吗?绝对干货这篇博文中的第四部分提到过

总结一下就是:只要变量的值为:0、null、" "、undefined或者NaN都将返回的是false,反之返回的是true。看下面例子

var a = 0,b = "12";
console.log(!!c); //false
// 分解上面的代码--Boolean(c)得false,取非为true,再取非为false。
console.log(!!d) //true
// 分解上面的代码--Boolean(d)true,取非为false,再取非为true

3、在遍历数组时,缓存数组的length

在处理一个数组循环时,我们好多人通常会这么写

for(var i = 0; i < array.length; i++) {
console.log(array[i]);
}

当我们遍历一个小型数组时,这样写是可以的,但是当我们处理一个大型数组时,这样写就会每次循环都计算数组的长度,会有延误,这时我们可以这样写

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]);
}

4、合理利用&&运算符

看看这段代码

if(a){
console.log("hello leonWu");
//解释一下这段代码,如果Boolean(a)为true,就打印出hello leonWu
}

我们稍微修改一下上面的代码

a && console.log("hello leonWu"); //结果是一样的,但是这样是不是简单清晰多了,代码量也少了

相关链接:js编码的实用技巧(二)

未完待续。。。。

github资源地址:https://github.com/js编码的实用技巧(一).md

我的个人博客:http://www.xiaolongwu.cn

csdn博客地址:https://blog.csdn.net/wxl1555

如果您对我的博客内容有疑惑或质疑的地方,请在下方评论区留言,或邮件给我,共同学习进步。

邮箱:wuxiaolong802@163.com

js基础进阶--编的实用技巧(一)的更多相关文章

  1. js基础进阶--关于setTimeout的思考

    欢迎访问我的个人博客:http://www.xiaolongwu.cn 先热身 看看下面的额代码会打印出什么? for (var i = 0; i < 5; i++) { setTimeout( ...

  2. js基础进阶--图片上传时实现本地预览功能的原理

    欢迎访问我的个人博客:http://www.xiaolongwu.cn 前言 最近在项目上加一个图片裁剪上传的功能,用的是cropper插件,注意到选择本地图片后就会有预览效果,这里整理一下这种预览效 ...

  3. js基础进阶--编码实用技巧(二)

    我的个人博客:http://www.xiaolongwu.cn 接上篇文章 js编码的实用技巧(一) 5.合理利用||运算符 使用||可以作为参数之外的默认值,当第一个参数返回值为false时,那么第 ...

  4. js基础进阶--关于Array.prototype.slice.call(arguments) 的思考

    欢迎访问我的个人博客:http://www.xiaolongwu.cn Array.prototype.slice.call(arguments)的作用为:强制转化arguments为数组格式,一般出 ...

  5. JS基础_Unicode编码表

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  6. 【原创】分布式之数据库和缓存双写一致性方案解析(三) 前端面试送命题(二)-callback,promise,generator,async-await JS的进阶技巧 前端面试送命题(一)-JS三座大山 Nodejs的运行原理-科普篇 优化设计提高sql类数据库的性能 简单理解token机制

    [原创]分布式之数据库和缓存双写一致性方案解析(三)   正文 博主本来觉得,<分布式之数据库和缓存双写一致性方案解析>,一文已经十分清晰.然而这一两天,有人在微信上私聊我,觉得应该要采用 ...

  7. VUE基础实用技巧

    Vue以前听说过,有了解过一点.当时还在热衷于原生JavaScript去写一些方法的封装,不是为啥,就感觉这样很帅,后面多多少少接触了一些JQuery的用法,到现在为止,JavaScript原生封装的 ...

  8. 【JavaScript实用技巧(二)】Js操作DOM(由问题引发的文章改版,新人大佬都可)

    [JavaScript实用技巧(二)]Js操作DOM(由问题引发的文章改版,新人大佬都可!) 博客说明 文章所涉及的资料来自互联网整理和个人总结,意在于个人学习和经验汇总,如有什么地方侵权,请联系本人 ...

  9. 网站开发进阶(十五)JS基础知识充电站

    JS基础知识充电站 1.javascript alert弹出对话框时确定和取消两个按钮返回值? 用的不是alert对话框,是confirm confirm(str); 参数str:你要说的话或问题: ...

随机推荐

  1. 开源视频平台:MediaCore(MediaDrop)

    MediaCore 是一个多媒体的建站系统,主要的功能包括视频.音频.YouTube集成.播客和 iTunes RSS 生成,用户可以提交各种多媒体内容. <开源中国>网站上说它是一个开源 ...

  2. apache tomcat集群

    今天花了大概两个小时完成了tomcat与apache的集群.现记录一下,也希望能帮助后来者. 建议看这篇博客前,先阅读一下鄙人拙作 tomcat整合apache 看完那个后,再进行集群,就很快了. 和 ...

  3. 02_JNI中Java代码调用C代码,Android中使用log库打印日志,javah命令的使用,Android.mk文件的编写,交叉编译

     1  编写以下案例(下面的三个按钮都调用了底层的C语言): 项目案例的代码结构如下: 2 编写DataProvider的代码: package com.example.ndkpassdata; ...

  4. ORM对象关系映射之使用GreenDAO进行CRUD操作

    在Android中,我们都知道使用的数据库是SQLite,而使用这种原生的数据库非常繁琐,它对表的管理和进行CRUD操作都需要我们写sql语句,在进行多表关联的操作上,更是需要写一堆sql,而且维护起 ...

  5. centos 下安装mysql-5.6.11

    这次是在centos6.4下安装mysql,在安装之前,你要先确定你的linux已经安装了这些包: wget, gcc-c++, ncurses-devel ,cmake, make ,perl 如果 ...

  6. CUDA跟OpenCV的混合编程,注意OpenCV需要重新编译

    1.注意事项 编译的办法参见: http://blog.csdn.net/wangyaninglm/article/details/39997113   以下是程序代码,网上搜的例子: 注意事项:32 ...

  7. The 13th tip of DB Query Analyzer, powerful processing EXCEL file

    The 13thtip of DB Query Analyzer, powerful processing EXCEL file MA Genfeng (Guangdong UnitollServic ...

  8. htmldom操作添加标签顺序

    <!DOCTYPE html> <html> <body> <div id="div1"> </div> <scr ...

  9. JavaScript继承详解

    面向对象与基于对象 在传统面向对象的语言中,有两个非常重要的概念 - 类和实例. 类定义了一类事物公共的行为和方法:而实例则是类的一个具体实现. 我们还知道,面向对象编程有三个重要的概念 - 封装.继 ...

  10. rsync+innotify做到同步式更新

    innotify主要功能: 他是内核用于通知用户控件程序文件系统变化的机制. 也就是说,当服务器发生了任何的改动,内核都会知道并通知用户. rssync(做同步的)+innotify做到的就是实时的同 ...