浅析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 相关文章推荐
javascript replace方法与正则表达式
Feb 19 Javascript
JavaScript中关于indexOf的使用方法与问题小结
Aug 05 Javascript
jQuery表格排序组件-tablesorter使用示例
May 26 Javascript
javascript的日期对象、数组对象、二维数组使用说明
Dec 22 Javascript
jQuery使用attr()方法同时设置多个属性值用法实例
Mar 26 Javascript
使用requestAnimationFrame实现js动画性能好
Aug 06 Javascript
Java中Timer的用法详解
Oct 21 Javascript
ES6中Array.find()和findIndex()函数的用法详解
Sep 16 Javascript
解决Vue编译时写在style中的路径问题
Sep 21 Javascript
webpack配置proxyTable时pathRewrite无效的解决方法
Dec 13 Javascript
javascript面向对象程序设计实践常用知识点总结
Jul 29 Javascript
Vue 动态路由的实现及 Springsecurity 按钮级别的权限控制
Sep 05 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下载文件名中解决乱码的问题
2013/06/20 PHP
php 类自动载入的方法
2015/06/03 PHP
PHP爬虫之百万级别知乎用户数据爬取与分析
2016/01/22 PHP
Zend Framework教程之Zend_Db_Table_Row用法实例分析
2016/03/21 PHP
php探针使用原理和技巧讲解
2019/09/17 PHP
javaScript Array(数组)相关方法简述
2009/07/25 Javascript
简洁短小的 JavaScript IE 浏览器判定代码
2010/03/21 Javascript
JavaScript避免代码的重复执行经验技巧分享
2014/04/17 Javascript
Bootstrap入门书籍之(三)栅格系统
2016/02/17 Javascript
详解原生JavaScript实现jQuery中AJAX处理的方法
2016/05/10 Javascript
什么是JavaScript注入攻击?
2016/09/14 Javascript
Bootstrap如何创建表单
2016/10/21 Javascript
JS基于面向对象实现的拖拽功能示例
2016/12/20 Javascript
jQuery插件HighCharts绘制2D金字塔图效果示例【附demo源码下载】
2017/03/09 Javascript
关于jQuery库冲突的完美解决办法
2017/05/20 jQuery
微信小程序实现搜索框功能及踩过的坑
2020/06/19 Javascript
[44:50]2018DOTA2亚洲邀请赛 4.1 小组赛 A组 TNC vs VG
2018/04/02 DOTA
构建Python包的五个简单准则简介
2015/06/15 Python
matplotlib savefig 保存图片大小的实例
2018/05/24 Python
python修改txt文件中的某一项方法
2018/12/29 Python
python中正则表达式与模式匹配
2019/05/07 Python
python能自学吗
2020/06/18 Python
Python多线程的退出控制实现
2020/08/10 Python
Python描述数据结构学习之哈夫曼树篇
2020/09/07 Python
Python基于pillow库实现生成图片水印
2020/09/14 Python
关于多种方式完美解决Python pip命令下载第三方库的问题
2020/12/21 Python
小溪流的歌教学反思
2014/02/13 职场文书
初中高效课堂实施方案
2014/02/26 职场文书
投资合作协议书
2014/04/17 职场文书
离婚协议书范文
2015/01/26 职场文书
水电工程师岗位职责
2015/02/13 职场文书
企业财务总监岗位职责
2015/04/03 职场文书
同事打架检讨书
2015/05/06 职场文书
总经理年会致辞
2015/07/29 职场文书
导游词之包公祠
2019/11/25 职场文书
redis缓存存储Session原理机制
2021/11/20 Redis