我的个人博客: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. 【Android 应用开发】Ubuntu 下 Android Studio 开发工具使用详解 (旧版本 | 仅作参考)

    . 基本上可以导入项目开始使用了 ... . 作者 : 万境绝尘 转载请注明出处 : http://blog.csdn.net/shulianghan/article/details/21035637 ...

  2. spring揭秘 读书笔记 一 IoC初探

    本文是王福强所著<<spring揭秘>>一书的读书笔记 ioc的基本概念 一个例子 我们看下面这个类,getAndPersistNews方法干了四件事 1 通过newsList ...

  3. netty对http协议解析原理解析

    本文主要介绍netty对http协议解析原理,着重讲解keep-alive,gzip,truncked等机制,详细描述了netty如何实现对http解析的高性能. 1 http协议 1.1 描述 标示 ...

  4. 更改EBS服务器域名/IP

    more: 341322.1 : How to change the hostname of an Applications Tier using AutoConfig 338003.1 : How  ...

  5. Vim编译器的常用使用方法与技巧

    vim操作 插入模式         命令行模式         末行模式 命令行模式  ->   插入模式 i --->   在当前光标的前一个插入 I --->   在行首插入 ...

  6. Android绘图机制(三)——自定义View的实现方式以及半弧圆新控件

    Android绘图机制(三)--自定义View的三种实现方式以及实战项目操作 在Android绘图机制(一)--自定义View的基础属性和方法 里说过,实现自定义View有三种方式,分别是 1.对现有 ...

  7. Java语言实现二分法

    二分法是一个简单,高效,并广泛应用的查找方法 import java.util.arrays; public class BinarySearch { public static int rank(i ...

  8. DB Query Analyzer 5.03 is distributed, EXCEL table name will be enclosed in square bracket

      DB Query Analyzer 5.03 is distributed, table name will be enclosed in square bracket automatically ...

  9. Oracle12c(12.1)中性能优化&amp;功能增强之通过参数THREADED_EXECTION使用多线程模型

    1.   后台 UNIX/Linux系统上,oracle用多进程模型.例如:linux上一个常规安装的数据库会有如下进程列: $ ps -ef | grep [o]ra_ oracle  15356  ...

  10. DB2常见问题

    15.1实例常见问题和诊断案例 1.实例无法启动问题 db2nodes.cfg文件,主要是为了数据库分区设计的.如果实例无法启动,要检查db2nodes.cfg,看配置是否正常.db2systm实例配 ...