1. js 数字操作:
    1.1 取整:
    取整有很多方法如:

    1. parseInt(a,10);
    2. Math.floor(a);
    3. a>>0;
    4. ~~a;
    5. a|0;

    前面2种是经常用到的,后面3种算是比较偏的,因为其有不足之处,比如将下面代码放到 console 里测试:

    1. var num = 2150000000;
    2. console.log(num|0);
    3. console.log(parseFloat(num))

    你会发现问题;
    输出的是:

    1. -2144967296
    2. 2150000000

    其原因就在于js数字存储的方式,js的数值存储可以说是32位64位是透明的的,他的前31位是用来存数字,32位是存符号(表示正负),
    所以一次位操作,他最大的数字是 2^31 ,比它大的数字才会出现问题,所以才这个数字以下的操作大家都不用担心的;

    1.2 数字的加减:
    这个应该很多人都知道,如0.1+0.2,使用 console 计算的结果并不是你们想象的0.3,而是0.30000000000000004;
    原因嘛,是因为js 是基于 IEEE754 数值的计算,所有使用的都会有这毛病,比如早期的 Java;
    而我们进行加减运行时,可以对其小数点进行控制,来省略不必要的小数;

  2. 逻辑运算符:
    2.1 在我之前学习的时候,只说明了这样的情况

    1. //||或:
    2. var bar = foo||apple;
    3. //约等于
    4. if(foo){
    5. bar = foo;
    6. }else{
    7. bar = apple;
    8. }
    9. //&&且:
    10. var bar = foo&&apple;
    11. if(foo){
    12. bar = apple;
    13. }else{
    14. bar = foo;
    15. }

    我想大家看到这个也许知道了是怎么回事,但是却不知道应用的场景吧;
    ||(或),一般用来创建值得默认值,比如var foo = bar || 1;,这样可以联系上面,当 bar 没有值的时候 foo = 1;

    而&&(且)我觉得作用比或要大,因为他有短路的功能,举个例子:

    1. var data = {
    2. msg:{
    3. foo:1
    4. }
    5. }
    6. var bar = data.msg && data.msg.foo;

    这里使用且可以用来判断 foo 的前置 msg 是否存在,如果不存在就直接返回 undefined,
    并且不会报错,而单独使用 data.msg.foo 时,若 msg 不存在,则会出现 Cannot read property 'foo' of undefined 的报错,
    这个在日常工作共较为重要;

    而另外一个例子:

    1. var isRun = true;
    2. function foo(callback){
    3. callback && callback();
    4. //或者:
    5. isRun && callback();
    6. }

    在函数中判断是否有回调函数或者设置值是否为TRUE,若TRUE则执行;
    2.2 一种偏门用法:
    如果对于某个input需要验证的话,那么可以使用","来进行分割判断

    1. var input = '',err = ''
    2. if(input || (err='请输入内容'),input.length>10 && (err = '长度过长'),err){
    3. console.log(err)
    4. }

    简单的说下,关于逗号运算符:
    在有逗号的情况下,只需要看逗号后面的代码返回是什么就行了,前面的代码只是执行,并不会去影响if的判断
    上述代码等于:

    1. var input = '',err = '';
    2. if(!input){
    3. err = '请输入内容'
    4. }
    5. if(input.length>10){
    6. err = '长度过长'
    7. }
    8. if(err){
    9. console.log(err)
    10. }
  3. 替换 else if:
    这个问题也是老生常谈了,我就简单的说下;
    3.1 使用 switch 替换:
    相信不用我多说了,不过有一点,在 case 里要使用 break 或 return,不然会出现一个问题:

    1. var a = 1;
    2. switch(true){
    3. case a<2:
    4. console.log(1);
    5. case a<3:
    6. console.log(2);
    7. }

    运行后可以看到,输出了1,2 那么是 a<2 且 a<3 了吗? 其实并不是:

    1. var a = 1;
    2. switch(true){
    3. case a<2:
    4. console.log(1);
    5. case a<1:
    6. console.log(2);
    7. }

    将 a<3 替换为 a<1,运行后,仍然是输出1,2 这可以说明 a<1 并没有被判断;
    这个地方需要被注意,很多错误都会因此而引发;

    3.2 使用对象替换:

    1. function check(foo){
    2. return {
    3. 1:'warnging',
    4. 2:'success',
    5. 3:'error'
    6. }[foo]
    7. }

    可以用对象的方法来替换if,并且也可以通过或(且)加入默认值:

    1. function type(foo){
    2. return {
    3. 1:'warning',
    4. 2:'success',
    5. 3:'error'
    6. }[foo]|| 'default'
    7. }

    对比一下,比 if else 方便,简洁了很多;
    如果 foo 是一个从0开始的数字那么使用数组也是一个好的选择:

    1. function type(foo){
    2. return ['warning','success','error'][foo]|| 'default'
    3. }

    也许有人会说逻辑运算符也能代替,但是不要忘记了代码的可读性,像var a = bar && foo || (baz && qux) 这样的代码,可读性太差了;

    要记得代码的可读性,可维护性是和他的性能同样重要的;

JavaScript中的一些小技巧的更多相关文章

  1. ACM 做题过程中的一些小技巧。

    ACM做题过程中的一些小技巧. 1.一般用C语言节约空间,要用C++库函数或STL时才用C++; cout.cin和printf.scanf最好不要混用. 2.有时候int型不够用,可以用long l ...

  2. C语言中的调试小技巧

    C语言中的调试小技巧 经常看到有人介绍一些IDE或者像gdb这样的调试器的很高级的调试功能,也听人说过有些牛人做工程的时候就用printf来调试,不用特殊的调试器.特别是在代码经过编译器一些比较复杂的 ...

  3. jquery获取json对象中的key小技巧

    jquery获取json对象中的key小技巧 比如有一个json var json = {"name" : "Tom", "age" : 1 ...

  4. ES6中常用的小技巧,用了事半功倍哦

    ES6中常用的小技巧,如果能在实际项目中能使用到,必定事半功倍: 1. 强制要求参数 ES6提供了默认参数值机制,允许你为参数设置默认值,防止在函数被调用时没有传入这些参数. 在下面的例子中,我们写了 ...

  5. C#中使用swagger小技巧

    C#中使用swagger小技巧 swaggerUI显示的接口内容主要用于开发阶段便于与前端联调,不适合发布到对外的站点. 有以下两种方式,让接口不显示在SwaggerUI中 1.使用属性 [ApiEx ...

  6. 前端网络、JavaScript优化以及开发小技巧

    一.网络优化 YSlow有23条规则,中文可以参考这里.这几十条规则最主要是在做消除或减少不必要的网络延迟,将需要传输的数据压缩至最少. 1)合并压缩CSS.JavaScript.图片,静态资源CDN ...

  7. JavaScript使用中的一些小技巧

    任何一门技术在实际中都会有一些属于自己的小技巧.同样的,在使用JavaScript时也有一些自己的小技巧,只不过很多时候有可能容易被大家忽略.而在互联网上,时不时的有很多同行朋友会总结(或收集)一些这 ...

  8. JavaScript的取值小技巧之“中括号[]取值法”

    一.简介 做下记录,今天看了一篇很有意思的文章,学到了这个取值的小技巧 正常的话我们一般都是用对象直接去'.'对应的属性名(也就是键值对的键)来获取对应的值 这里记录的是另一种取值方式,他是采用中括号 ...

  9. javascript的几个小技巧

    1.在循环中缓存array.length 这个技巧很简单,这个在处理一个很大的数组循环时,对性能影响将是非常大的.基本上,大家都会写一个这样的同步迭代的数组. for(var i=0;i<arr ...

随机推荐

  1. getpwuid()

    getpwuid函数是通过用户的uid查找用户的passwd数据.如果出错时,它们都返回一个空指针并设置errno的值,用户可以根据perror函数查看出错的信息. 外文名 getpwuid() 头文 ...

  2. 【转】电信100M光纤无线下载速度仅为5MB/秒的困惑

    原文网址:http://itbbs.pconline.com.cn/50463999.html 在江苏电信官方测速网站测速的.1.光猫F460有线连接至笔记本,下载速度为12MB/秒左右:2.F460 ...

  3. http链接

    1,打开一个网页是多少个请求:如果是一个html页面就是一个,解析后面css,js就是很多个  一般都是多个http请求 浏览器先根据地址栏地址发送一个http请求获取html网页 然后浏览器解析ht ...

  4. Linux history时间用户ip设置

    Linux history时间用户ip设置        在使用linux服务器的时候发生一些不知道谁操作的问题,google一下说history命令可以查看到历史记录,用过之后发现还是不够详细,再g ...

  5. 搭建基于hyperledger fabric的联盟社区(四) --chaincode开发

    前几章已经分别把三台虚拟机环境和配置文件准备好了,在启动fabric网络之前我们要准备好写好的chaincode.chaincode的开发一般是使用GO或者JAVA,而我选择的是GO语言.先分析一下官 ...

  6. Windows下安装HBase

    本文转载自:http://blog.csdn.net/kangkanglou/article/details/30748139 本文主要参照Hbase官网:http://hbase.apache.or ...

  7. 3069: [Pa2011]Hard Choice 艰难的选择

    Description Byteasar是一个很纠结的人.每次他经过Bytetown的时候都知道有至少2条不同的路径可以选择,这导致他必须花很长时间来决定走哪条路.Byteasar最近听说了Bytet ...

  8. 杂项-数学软件:MATLAB

    ylbtech-杂项-数学软件:MATLAB MATLAB是美国MathWorks公司出品的商业数学软件,用于算法开发.数据可视化.数据分析以及数值计算的高级技术计算语言和交互式环境,主要包括MATL ...

  9. 第六章 hbase shell 命令

    hbase shell命令                             描述  alter 修改列族(Column Family)模式 count 统计表中行的数量 create 创建表 ...

  10. Window app遇到的问题

    Windows下两个应用之间进行UDP通讯,必须要先互相发送过数据,才能收到其他的数据.解决方法: <Capabilities> <Capability Name="int ...