JavaScript避坑记

转载请注明源地址: http://www.cnblogs.com/funnyzpc/p/8407952.html

上图=>

  有意思的漫画,不知大家看懂了没,这里我想说的是以上这些坑我都碰过,当然包含且不仅限于此, 遂这次借漫画将之前写前端时掉过的坑一一罗列哈(虽然不够完整。。。)。

第一回合:js运算精度问题=>

 输入>0.1+0.2==0.3
返回>false 输入>0.1+0.2
返回>0.30000000000000004

  很怪,经常会在前端计算的时候碰到这个问题,所以如果是多个变量相运算切勿两两预算后再将其值和其余变量运算,这样很容易掉坑,如果实在不行的话,我支一招,请看->

 输入>var num=0.1+0.2;
输入>var num2=num.toFixed(2);
输入>num2
返回>"0.30"
输入>Number(num2);
返回>0.3

  思路很简单,先赋给个变量,用toFixed(保留小数位);函数四舍五入,但是这样还不够,如果处理的值还需要参与运算的话,需要用Number(值/变量);函数转换为数字类型,因为js属于脚本语言,这个问题也时常会被忽略,各位一定要小心谨慎才是呀~

第二回合:js变量运算问题,请看=>

 输入>"2"-3
返回>-1 输入>"2"+3
返回>"23" 输入>"2"+-3
返回>"2-3"

  额,我想说的是。。。你得绕道走。。。,为什么,因为两种类型之间的运算,运算方式走的内部逻辑不一样,有时候java也会碰到这个问题,但是java有巨多处理函数来避坑,对于js处理以上类别问题,能通过其他方式避免更好,如不能还是给个解决思路吧,额,具体点儿就是:将所有的运算参数先转成Number类型再运算,如果是变量类型,切需要注意你的变量是否包含数字,如果不包含就更麻烦了,需要用isNaN(变量);函数来处理后再行Number函数处理后运算之->

 输入>Number("2")-Number("3")
返回>-1 输入>Number("2")+Number("3")
返回>5 输入>Number("2")+-Number("3")
返回>-1

第三回合:数字字符串比较大小问题=>

 输入>"1">"2"
返回>false 输入>"11">"9"
返回>false

  这个问题,怎么说呢,如果需要比较的是数字,请将比较两边的字符串数字转换成数字后再行比较的好(Number(变量);函数),如果比较的是字符串的话,需要说的是如果比较两边都是字符的话,实际比较是按相同位置上的数字大小来比较的,所以看起来会有写怪怪的,如果比较的两边都是一位数的数字的话都是没有问题的,但是仅限于此;额~,需要再啰嗦的是如果两边的值的类型不一致的话一定要转换成一致类型的变量比较才会准确(数字和数字字符串比较也是坑。。。),这里就不给解药,大家看看以上两回合就知道具体解决办法啦。

第四回合:js中true、false与undefined的问题=>

 输入>undefined==true
返回>false 输入>undefined==false
返回>false 输入>if(!undefined) console.log(false);
返回>false

  看起来更加怪异,对不,额。。。,我想说的是:这个无解。。。(让我先哭会儿...)。。。;对于此只能死记硬背了,简单总结就是:undefined这个东东不等于false也不等于true,但是,但是,敲黑板=>在判断语句中它是false

现在是:2018-02-03 23:31:31,夜深了,狼来了,躲被窝

珍爱生命,远离JS=>JS避坑记的更多相关文章

  1. Arduino+AS608指纹锁避坑记

    Arduino+AS608指纹锁避坑记 .title { text-align: center; margin-bottom: 0.2em } .subtitle { text-align: cent ...

  2. js避坑历险记

    代码改变世界,世界改变码农,码农改变代码! 我就是我,我就是一个码农的武林. 前方JS巨坑出没,请注意集中力! 巨坑1:js精度问题 前段时间去一家物流公司面试,做了一个js题,印象尤为深刻: var ...

  3. JavaScript面试题(珍爱生命,远离面试)

    1.使用 typeof bar === "object" 判断 bar 是不是一个对象有神马潜在的弊端?如何避免这种弊端? 使用 typeof 的弊端是显而易见的(这种弊端同使用 ...

  4. Node.js的那些坑——如何让异步并发方法同步顺序执行(for循环+异步操作)

    1 前言 nodejs的回调,有时候真的是让人又爱又恨的,当需要用for循环把数据依次存入数据库,但是如果使用正常的for循环,永远都是最后一次值的记录,根本不符合要求. 解决此方案有几种,例如闭包( ...

  5. Nuxt.js的踩坑指南(常见问题汇总)

    本文会不定期更新在nuxt.js中遇到的问题进行汇总.转发请注明出处,尊重作者,谢谢! 强烈推荐作者文档版踩坑指南,点击跳转踩坑指南 在Nuxt的官方文档中,中文文档和英文文档都存在着不小的差异. 1 ...

  6. 15. Go 语言“避坑”与技巧

    Go 语言"避坑"与技巧 任何编程语言都不是完美的,Go 语言也是如此.Go 语言的某些特性在使用时如果不注意,也会造成一些错误,我们习惯上将这些造成错误的设计称为"坑& ...

  7. 【转】Vue 脱坑记 - 查漏补缺(汇总下群里高频询问的xxx及给出不靠谱的解决方案)

    前言 文章内容覆盖范围,芝麻绿豆的破问题都有,不止于vue; 给出的是方案,但不是手把手一字一句的给你说十万个为什么! 有三类人不适合此篇文章: “喜欢站在道德制高点的圣母婊” – 适合去教堂 “无理 ...

  8. Vue 脱坑记

    问题汇总 Q:安装超时(install timeout) 方案有这么些: cnpm : 国内对npm的镜像版本 /* cnpm website: https://npm.taobao.org/ */ ...

  9. Vue + TypeScript + Element 搭建简洁时尚的博客网站及踩坑记

    前言 本文讲解如何在 Vue 项目中使用 TypeScript 来搭建并开发项目,并在此过程中踩过的坑 . TypeScript 具有类型系统,且是 JavaScript 的超集,TypeScript ...

随机推荐

  1. java_web学习(三) eclipse_jsp学习

    1.首先打开eclipse,新建一个Dynamac web project项目文件 2.在WebContent单击右键创建JSP File 3.过程 4.简单的jsp代码 运行结果: 5.导出war文 ...

  2. Offcanvas 自适应窗口示例

    <!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8&qu ...

  3. 开发高性能JAVA应用程序基础(内存篇)

    虽然Java的垃圾回收和当前高配置的服务器可以让程序员大部分时间忘掉OutOfMemoryError的存在,但是访问量增大后频繁的GC会额外消耗CPU (使用top查看结果为us值高),系统响应速度下 ...

  4. Codeforces 839E Mother of Dragons【__builtin_popcount()的使用】

    E. Mother of Dragons time limit per test:2 seconds memory limit per test:256 megabytes input:standar ...

  5. [bzoj2286] [Sdoi2011消耗战

    还是虚树恩..模板都能打挂QAQ 先在原树上预处理出mndis[i],表示根节点到节点i 路径上边权的最小值(就是断开i与根的联系的最小花费) 建完虚树在虚树上跑树形DP..f[i]表示断开  i 所 ...

  6. android文件管理器源码、斗鱼直播源码、企业级erp源码等

    Android精选源码 文件清理管理器 自定义水平带数字的进度条以及自定义圆形带数字的进度条 利用sectionedRecyclerViewAdapter实现分组列表的recyclerView源码 流 ...

  7. c++(递归和堆栈)

    看过我前面博客的朋友都清楚,函数调用主要依靠ebp和esp的堆栈互动来实现的.那么递归呢,最主要的特色就是函数自己调用自己.如果一个函数调用的是自己本身,那么这个函数就是递归函数. 我们可以看一下普通 ...

  8. 使用Android Studio过程中,停留在“Building ‘工程名’ Gradle project info”的解决方法

    http://www.loverobots.cn/in-the-process-of-using-studio-android-the-solution-of-the-project-info-gra ...

  9. 在vue-cli项目中使用echarts

    这个示例使用 vue-cli 脚手架搭建 安装echarts依赖 npm install echarts -S 或者使用国内的淘宝镜像: 安装 npm install -g cnpm --regist ...

  10. 读懂_countof,可以懂得什么

    在c++开发中数组是我们经常使用存储结构,而于此同时"数组越界"是每个c++程序员不能不提防陷阱. 还好,我们有预定义宏_countof. 一.在visual c++开发环境下,它 ...