js类型转换的坑
JS的灵活
说好听是说JS灵活, 说不好听就是JS的坑太多, JS类型转换就是一个大坑, JS的类型包括了原始类型的[null, undefined, String ,Number, Boolean],以及对象类型的[function, object];
null, undefined, "", , -, NaN 转换成布尔值是false, 剩下的全转化为 ==>> true;
null, "", false, , [] 转换成数字是 ==>> ;
undefind, "One", 一个非数字值的数组:["a"], function(){} 转化成数字是 ==>> NaN;
true, 一个值为数字的数组:[] , 是数字的字符串:"",转换为数字是 ==>> 1;


其中null和undefined没有构造函数, 他们两个转化为对象的时候会报类型错误;
JS把对象转化成原始值
JS如果把对象转化成只付出 会调用对象的toString()方法,如果toString()方法返回的值是一个对象,那么会调用对象的valueOf()方法,把valueOf()的返回值转化成字符串, 如果该值还不是原始值就会报错;

对象转化成数字的时候会调用valueOf()方法, 如果该方法返回值非原始值, 那么回调用该对象的toString(), 把toString的返回值转化成数字, 如果toString()返回值还是非原始值,那么就会报错;

那么为什么第一个是NaN呢? 因为obj是一个空对象, (除了Date类型的对象的valueOf()返回的是数字以外, 所有的对象的valueOf()返回自己 , 神设定~。~),obj的valueOf()返回的是对象,所以他又调用toString()方法, toString()返回了字符串[object Object], [object Object]转化成数字就变成了NaN;
如果是对象类型转换成原始类型,只要把需要转化的对象放到原始类型的构造函数中进行解包,比如:
Number( {valueOf:function(){return }} ) // ==>> 1111
String( {toString:function(){return }} ) //==>> "1111"
Boolean( {} ) // ==>> true
如果你觉得麻烦的话可以通过算术运算符进行快速转换:
var obj = { toString : function() {return }};
obj+"" ==>> "";
var obj = { valueOf : function() {return }};
+obj ==>> ;
JS把原始值转化成对象
要让原始类型转化成对象类型要将元素类型放到对象类型的构造函数中, 需要让构造函数包装;
console.log( typeof true ); //==>> boolean
console.log( typeof new Boolean( true ) ) //==>> object

参考表
表作为参考, 来自js权威指南, 看过书的应该都记得这表:
| 原始类型和对象类型 | 转换成String: | 转换成Number | 转换成Boolean | 转换成Object |
|---|---|---|---|---|
| undefined | "undefined" | NaN | false | throws TypeError |
| null | "null" | 0 | false | throws TypeError |
| true | "true" | 1 | new Boolean(true) | |
| false | "false" | 0 | new Boolean(false) | |
| "" (empty string) | 0 | false | new String("");Object("") | |
| "1.2" (nonempty, numeric) | 1.2 | true | new String("1.2");Object("1.2") | |
| "one" (nonempty, non-numeric) | NaN | true | new String("one");Object("one") | |
| 0 | "0" | false | new Number(0);Object(0) | |
| -0 | "0" | false | new Number(-0);Object(-0) | |
| NaN | "undefined" | false | new Number(NaN);Object(NaN) | |
| Infinity | "Infinity" | true | new Number(Infinity);Object(Infinity) | |
| -Infinity | "-Infinity" | true | new Number(-Infinity);Object(-Infinity) | |
| 1 (finite, non-zero) | "1" | true | new Number(1);Object(1) | |
| {} (any object) | NaN | true | ||
| [] (empty array) | "" | 0 | true | |
| [9] (1 numeric elt) | "9" | 9 | true | |
| ['a'] (any other array) | use join() method | NaN | true | |
| function(){} (any function | "undefined" | NaN | true |
js类型转换的坑的更多相关文章
- Node.js的那些坑——如何让异步并发方法同步顺序执行(for循环+异步操作)
1 前言 nodejs的回调,有时候真的是让人又爱又恨的,当需要用for循环把数据依次存入数据库,但是如果使用正常的for循环,永远都是最后一次值的记录,根本不符合要求. 解决此方案有几种,例如闭包( ...
- Nuxt.js的踩坑指南(常见问题汇总)
本文会不定期更新在nuxt.js中遇到的问题进行汇总.转发请注明出处,尊重作者,谢谢! 强烈推荐作者文档版踩坑指南,点击跳转踩坑指南 在Nuxt的官方文档中,中文文档和英文文档都存在着不小的差异. 1 ...
- js类型转换
1.js中有六种基本类型,分别是object.number.string.Boolean.null.undefined,其中number.string.Boolean为基本类型,有时使用会强制转换成对 ...
- js 类型转换学习
类型转换分为显示转换和隐式转换 参考http://www.cnblogs.com/mizzle/archive/2011/08/12/2135885.html 先事件显示的 通过手动进行类型转换,Ja ...
- js的一些坑,持续增加,学习js应该注意的问题
大家来补充 1.变量类型模糊,容易出现问题; var a='1',b=1; a==b; //true a===b; //false 2.全局变量与函数内部变量同名时,在函数内部声明变量,声明位置虽然在 ...
- JS 对象、HTML事件处理、JS 类型转换、Date
1. JS 对象 <script> var Person = new Object(); Person.id = 1; Person.name = "Hello World&qu ...
- 你可能忽略的js类型转换
前言 相信刚开始了解js的时候,都会遇到 2 == '2',但 1+2 == 1+'2'为false的情况.这时候应该会是一脸懵逼的状态,不得不感慨js弱类型的灵活让人发指,隐式类型转换就是这么猝不及 ...
- 一些angular/js/ts的坑和吐槽
------20190318 ------------- 回头看,很多槽点已经随着升级改掉了 绑定string字面值到子组件@Input <app-overlay-static [name] ...
- js 面试的坑
JavaScript事件属性event.target <!DOCTYPE html> <html> <head> <meta charset="UT ...
随机推荐
- NOIP2015聪明的质检员[二分 | 预处理]
背景 NOIP2011 day2 第二题 描述 小T 是一名质量监督员,最近负责检验一批矿产的质量.这批矿产共有 n 个矿石,从 1到n 逐一编号,每个矿石都有自己的重量 wi 以及价值vi .检验矿 ...
- [No000053]我25岁了,是应该继续挣钱,还是选择自己的爱好?--正好庆祝自己25岁生日
你所问的问题正是问题所在.停止做出重大决策,专注于缩小你想到达的地位与你之间的差距. 成功的生活并非由简单而鲜明的决定组成,它们更像这幅图: 但悲伤的是,太多人的状态类似于这幅图: 我知道这听上去很显 ...
- luogu[1279]字串距离
题目描述 设有字符串X,我们称在X的头尾及中间插入任意多个空格后构成的新字符串为X的扩展串,如字符串X为”abcbcd”,则字符串“abcb□cd”,“□a□bcbcd□”和“abcb□cd□”都是X ...
- 装完Centos7提示Initial setup of CentOS Linux 7 (core)(转载)
http://www.th7.cn/system/lin/201603/156762.shtml
- 蓝灯github地址
https://github.com/getlantern/lantern/ 闪电联盟蓝灯: http://bbs.sdbeta.com/read-htm-tid-556664.html
- cell与cell之间的间距问题,以及section跟随屏幕滑动而滑动问题
苹果在cell与cell之间默认没有间距,这样有时候不能满足我们界面要求,所以我们就需要将cell设置为分组模式(也就是每组一行或者多行,分为n组),然后我们就可以在代理中根据自己的需求设计cell之 ...
- Java 集合系列16之 HashSet详细介绍(源码解析)和使用示例
概要 这一章,我们对HashSet进行学习.我们先对HashSet有个整体认识,然后再学习它的源码,最后再通过实例来学会使用HashSet.内容包括:第1部分 HashSet介绍第2部分 HashSe ...
- [转]git fetch 的简单用法:更新远程代码到本地仓库
[原文地址]:http://my.eoe.cn/com360/archive/3533.html Git中从远程的分支获取最新的版本到本地方式如下,如何更新下载到代码到本地,请参阅ice的博客基于Gi ...
- 关于Microsoft Visual Studio 2010系统自带的数据库
转自:http://blog.sina.com.cn/s/blog_a570cca601012x5w.html 1.Visual studio Tools>命令提示 2.aspnet_regsq ...
- mac 10.9.4下配置apache
mac 10.9.x已经自带了apache,可按如下步骤开启: 1.启动 sudo apachectl start 启动后,访问 http://localhost/ 应该能看到"It wor ...