浅析JavaScript中的隐式类型转换


Posted in Javascript onDecember 05, 2013

如果把通过函数或方法调用,明确的将某种类型转换成另一种类型称为显示转换 ,相反则称为隐式类型转换 。google和维基百科中没有找到“显示类型转换”,“隐式类型转换”的字眼。暂且这么称呼。

一、 运算中存在的隐式类型转换

1, “+”运算符

var a = 11, b = '22'; 
var c = a + b;

这里引擎将会先把a变成字符串"11"再与b进行连接,变成了"1122"。有人会有疑问,为什么不把b变成数字22再进行算术加运算呢,这样的话c就是33了。没有为什么,当运算符“+”两边一个是数字类型,一个是字符串类型时,js引擎规定进行字符串连接运算而非算术加运算。利用运算符“+”这个特性,可以很方便的将Number转换成String。如
var a = 11; 
alert(typeof a); //-->number 
a = a + ''; 
alert(typeof a); //-->string

2,“-”运算符

“-”可以是一元运算符(取负),也可以是二元(减法运算)的。如

var a = 11, b = '5'; 
var c = a - b; 
alert(typeof c); //--> number

这里与上面的“+”相反,会把字符串b隐式的转换成数字5再进行算术减法运算。利用这个特性,可以很方便的将String转换成Number
var a = '11'; 
a = a - ''; 
alert(typeof a);// -->number

二、 语句中存在的隐式类型转换

1,if

var obj = {name:'jack'} 
if(obj){ 
    //do more 
}

这里会把obj隐式的转换成Boolean类型

2,while

var obj = {name:'jack'} 
while(obj){ 
    //do more 
}

同if

3,for in时的类型转换
定义对象字面量时发生从标识符到字符串的隐式转换。

var person = {'name':'jack',"age":20,school:'PKU'}; 
for(var a in person){ 
    alert(a + ": " + typeof a); 
}

这里name,age分别加单/双引号以强调其为String类型,school没有加单/双引号。我们遍历下该对象的属性,查看其类型。发现school也被隐式的转换成了String类型。

数组的索引其实也是字符串类型。这着实令人惊叹,但事实的确如此。如

var ary = [1,3,5,7]; 
for(var a in ary){ 
    alert(a + ": " + typeof a); 
}

三、 alert时存在的隐式类型转换
String.prototype.fn = function(){return this}; 
var a = 'hello'; 
alert(typeof a.fn()); //-->object 
alert(a.fn()); //-->hello

给String原型上添加了个fn方法,该方法返回this,我们知道this可以理解成当前类的实例对象,既然是对象那么typeof a.fn()自然返回是object了。
关键是最后的alert(a.fn()),a.fn()返回的明明是对象,但却隐式的转换成了字符串“hello”显示。

同样的情况发生在数字类型上,如

Number.prototype.fn = function(){return this}; 
var a = 10; 
alert(typeof a.fn());//-->object 
alert(a.fn()); //-->10

a.fn()返回的是对象类型,但在alert(a.fn())时会隐式的将其转换成数字。
Javascript 相关文章推荐
超清晰的document对象详解
Feb 27 Javascript
jQuery Tools Dateinput使用介绍
Jul 14 Javascript
jquery插件lazyload.js延迟加载图片的使用方法
Feb 19 Javascript
JavaScript中字符串拼接的基本方法
Jul 07 Javascript
原生js实现数字字母混合验证码的简单实例
Dec 10 Javascript
Bootstrap如何创建表单
Oct 21 Javascript
Node.js利用js-xlsx处理Excel文件的方法详解
Jul 05 Javascript
自定义事件解决重复请求BUG的问题
Jul 11 Javascript
js提取中文拼音首字母的封装工具类
Mar 12 Javascript
详解vue 命名视图
Aug 14 Javascript
js实现录音上传功能
Nov 22 Javascript
js实现时间日期校验
May 26 Javascript
浅析JavaScript中两种类型的全局对象/函数
Dec 05 #Javascript
完美解决IE低版本不支持call与apply的问题
Dec 05 #Javascript
JavaScript子类用Object.getPrototypeOf去调用父类方法解析
Dec 05 #Javascript
jQuery表格插件ParamQuery简单使用方法示例
Dec 05 #Javascript
各浏览器对document.getElementById等方法的实现差异解析
Dec 05 #Javascript
给事件响应函数传参数的四种方式小结
Dec 05 #Javascript
弹出最简单的模式化遮罩层的js代码
Dec 04 #Javascript
You might like
PHP最常用的ini函数分析 针对PHP.ini配置文件
2010/04/22 PHP
php写的AES加密解密类分享
2014/06/20 PHP
微信支付PHP SDK之微信公众号支付代码详解
2015/12/09 PHP
高质量PHP代码的50个实用技巧必备(下)
2016/01/22 PHP
JQuery 解析多维的Json数据格式
2009/11/02 Javascript
基于JQuery实现相同内容合并单元格的代码
2011/01/12 Javascript
JQuery onload、ready概念介绍及使用方法
2013/04/27 Javascript
解析URI与URL之间的区别与联系
2013/11/22 Javascript
node.js中的fs.lchownSync方法使用说明
2014/12/16 Javascript
jQuery中slideUp 和 slideDown 的点击事件
2015/02/26 Javascript
JavaScript整除运算函数ceil和floor的区别分析
2015/04/14 Javascript
jQuery事件绑定on()、bind()与delegate() 方法详解
2015/06/03 Javascript
浅谈jQuery中的$.extend方法来扩展JSON对象
2017/02/12 Javascript
webpack3+React 的配置全解
2017/08/21 Javascript
JS实现table表格固定表头且表头随横向滚动而滚动
2017/10/26 Javascript
jQuery实现的页面弹幕效果【测试可用】
2018/08/17 jQuery
解决layer弹层遮罩挡住窗体的问题
2018/08/17 Javascript
使用express来代理服务的方法
2019/06/21 Javascript
vue.js 2.0实现简单分页效果
2019/07/29 Javascript
Python入门篇之对象类型
2014/10/17 Python
利用Python绘制MySQL数据图实现数据可视化
2015/03/30 Python
深入学习Python中的装饰器使用
2016/06/20 Python
Python使用numpy实现BP神经网络
2018/03/10 Python
Python实现合并同一个文件夹下所有PDF文件的方法示例
2018/04/28 Python
Sanic框架配置操作分析
2018/07/17 Python
python中多个装饰器的调用顺序详解
2019/07/16 Python
Python装饰器用法与知识点小结
2020/03/09 Python
h5调用摄像头的实现方法
2016/06/01 HTML / CSS
改变生活的男士内衣:SAXX Underwear
2019/08/28 全球购物
一套PHP的笔试题
2013/05/31 面试题
小学数学教研活动总结
2014/07/01 职场文书
民政局副局长民主生活会个人整改措施
2014/10/04 职场文书
2014年校长工作总结
2014/12/11 职场文书
乔迁新居祝福语
2019/11/04 职场文书
JavaScript中MutationObServer监听DOM元素详情
2021/11/27 Javascript
sentinel支持的redis高可用集群配置详解
2022/04/01 Redis