javascript不同类型数据之间的运算的转换方法


Posted in Javascript onFebruary 13, 2014

js中不同类型的基础数据之间可以转换,这种转换是有规则可寻的,并非随意的随机的。在js中有5种基础类型数据:string、number、boolean、null、undefined,其中,常用于计算或者比较的类型是前面三种。

基础数据之间的转换

其它类型转化数字
原始数据类型 目标类型Number
undefined NaN
null 0
false 0
true 1
数字串 相应的数字
不能转化的字符串 NaN
其它类型转化为字符串
原始数据类型 目标类型String
undefined undefined
null null
false false
true true
数字 数字字符串

 

不同类型的基础数据之间的加法,数据先转换为number,然后转换为string(如果有string类型数据参与运算)

null + undefined // 0+NaN null + false // 0+0 
1 + true // 1+1 
1 + '1' //'11';数字与字符串相加结果是字符串 
1 + 2 + '3'  //'33';(1+2)的结果然后与'3'相加;这里要把每一步加法单独拆开来看,否则变成和下面一样的结果了. 
1 + (2 +'3') //'123';先运算2+'3',然后1+'23' 
's' + null //'snull' 
's' + undefined // 'sundefined' 
's' + true //'strue' 
1 + true + undefined + 's' // 1+1+NaN+'s'=2+NaN+'s'=NaN+'s'=NaNs

对象参与加减法运算

对象参与基础类型数据运算,先转化为基础类型。先调用其valueOf方法,如果返回的不是基础类型,再调用其toString方法,如果返回的还不是基础类型,则抛出错误。但是,Date数据刚好相反

//为了便于观察重写Date的toString方法和valueOf方法 Date.prototype.toString = function(){ 
    return 1; 
} 
Date.prototype.valueOf = function(){ 
    return 2; 
} 
var a = new Date, 
    b = new Date; 
a + b; // 调用toString,1 + 1,结果是2 
// 再重写toString方法 
Date.prototype.toString = function(){ 
    return {}; 
} 
var c = new Date, 
    d = new Date; 
c + d; // 调用toString方法返回的不是基础类型,再调用valueOf,2 + 2,结果是4 
// 再重写valueOf方法 
Date.prototype.valueOf = function(){ 
    return {}; 
} 
var e = new Date, 
    f = new Date; 
e + f; // 报错

把上面的例子换成Object或者其他类型能得到相应的结果,不过是先调用valueOf,再调用toString。

'+'号的神奇功效

数据前有加号‘+',可以让字符串转化为数字

+'1'+1 // 2 +'s'+2 // NaN

注:第一次,格式不好,纰漏多,欢迎大家拍砖
Javascript 相关文章推荐
分享27款非常棒的jQuery 表单插件
Mar 28 Javascript
HTTP 304错误的详细讲解
Nov 13 Javascript
js跨域问题浅析及解决方法优缺点对比
Nov 08 Javascript
javascript时间戳和日期字符串相互转换代码(超简单)
Jun 22 Javascript
node+vue实现用户注册和头像上传的实例代码
Jul 20 Javascript
Bootstrap 3多级下拉菜单实例
Nov 23 Javascript
JavaScript中toLocaleString()和toString()的区别实例分析
Aug 14 Javascript
一文搞懂ES6中的Map和Set
May 20 Javascript
vue中的面包屑导航组件实例代码
Jul 01 Javascript
解决使用layui对select append元素无效或者未及时更新的问题
Sep 18 Javascript
openlayers 3实现车辆轨迹回放
Sep 24 Javascript
Vue中使用import进行路由懒加载的原理分析
Apr 01 Vue.js
js清理Word格式示例代码
Feb 13 #Javascript
Js与下拉列表处理问题解决
Feb 13 #Javascript
js加载读取内容及显示与隐藏div示例
Feb 13 #Javascript
input禁止键盘及中文输入,但可以点击
Feb 13 #Javascript
JS实现将人民币金额转换为大写的示例代码
Feb 13 #Javascript
jquery清空表单数据示例分享
Feb 13 #Javascript
jquery提交form表单时禁止重复提交的方法
Feb 13 #Javascript
You might like
PHP 存储文本换行实现方法
2010/01/05 PHP
PHP动态页生成静态页的3种常用方法
2014/11/13 PHP
javascript数组去掉重复
2011/05/12 Javascript
Jquery之Ajax运用 学习运用篇
2011/09/26 Javascript
Firefox中beforeunload事件的实现缺陷浅析
2012/05/03 Javascript
window.onload和$(function(){})的区别介绍
2013/10/30 Javascript
js的alert样式如何更改如背景颜色
2014/01/22 Javascript
javascript 终止函数执行操作
2014/02/14 Javascript
jQuery获取iframe的document对象的方法
2014/10/10 Javascript
$.extend 的一个小问题
2015/06/18 Javascript
避免jQuery名字冲突 noConflict()方法
2016/07/30 Javascript
快速实现JS图片懒加载(可视区域加载)示例代码
2017/01/04 Javascript
MUI 实现侧滑菜单及其主体部分上下滑动的方法
2018/01/25 Javascript
Vue2.0 实现移动端图片上传功能
2018/05/30 Javascript
Vue项目部署的实现(阿里云+Nginx代理+PM2)
2019/03/26 Javascript
在python的类中动态添加属性与生成对象
2016/09/17 Python
python遍历小写英文字母的方法
2019/01/02 Python
利用Python进行图像的加法,图像混合(附代码)
2019/07/14 Python
手机使用python操作图片文件(pydroid3)过程详解
2019/09/25 Python
手把手教你安装Windows版本的Tensorflow
2020/03/26 Python
零基础学Python之前需要学c语言吗
2020/07/21 Python
python和C++共享内存传输图像的示例
2020/10/27 Python
python 下载文件的多种方法汇总
2020/11/17 Python
详解CSS3阴影 box-shadow的使用和技巧总结
2016/12/03 HTML / CSS
详解HTML5表单新增属性
2016/12/21 HTML / CSS
HTML5中外部浏览器唤起微信分享
2020/01/02 HTML / CSS
Agoda西班牙:全球特价酒店预订
2017/06/03 全球购物
小米俄罗斯授权商店:Xiaomi俄罗斯
2019/12/08 全球购物
幼儿教师自我鉴定
2013/11/02 职场文书
医学专业毕业生个人求职信
2013/12/25 职场文书
2014年综治宣传月活动总结
2014/04/28 职场文书
外贸业务员求职信
2014/06/16 职场文书
2015年志愿者服务工作总结
2015/04/20 职场文书
吴仁宝观后感
2015/06/09 职场文书
浅谈Redis位图(Bitmap)及Redis二进制中的问题
2021/07/15 Redis
Python pyecharts案例超市4年数据可视化分析
2022/08/14 Python