浅析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 相关文章推荐
Mootools 1.2教程 Tooltips
Sep 15 Javascript
jQuery 表单验证扩展(四)
Oct 20 Javascript
判断文件是否正在被使用的JS代码
Dec 21 Javascript
js实现的GridView即表头固定表体有滚动条且可滚动
Feb 19 Javascript
JS+CSS实现下拉列表框美化效果(3款)
Aug 15 Javascript
jQuery表格插件datatables用法详解
Nov 23 Javascript
浅谈jquery采用attr修改form表单enctype不起作用的问题
Nov 25 Javascript
Vue学习笔记之表单输入控件绑定
Sep 05 Javascript
vue axios整合使用全攻略
May 24 Javascript
Angular6中使用Swiper的方法示例
Jul 09 Javascript
详解Vue-axios 设置请求头问题
Dec 06 Javascript
layer弹出层自定义提交取消按钮的例子
Sep 10 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数组应用之比较两个时间的相减排序
2008/08/18 PHP
php生成html文件方法总结
2014/12/01 PHP
ThinkPHP通过AJAX返回JSON的两种实现方法
2014/12/18 PHP
Mac下php 5升级到php 7的步骤详解
2017/04/26 PHP
php使用yield对性能提升的测试实例分析
2019/09/19 PHP
利用JQuery动画制作滑动菜单项效果实现步骤及代码
2013/02/07 Javascript
jQuery之自动完成组件的深入解析
2013/06/19 Javascript
对js关键字命名的疑问介绍
2014/04/25 Javascript
ajax提交表单实现网页无刷新注册示例
2014/05/08 Javascript
Thinkphp模板没有解析直接原样输出的解决方法
2014/10/31 Javascript
angular.element方法汇总
2015/01/07 Javascript
jquery通过closest选择器修改上级元素的方法
2015/03/17 Javascript
windows下安装nodejs及框架express
2015/08/07 NodeJs
jquery实现简单的全选和反选功能
2016/01/02 Javascript
浅析Bootstrap组件之面板组件
2016/05/04 Javascript
Bootstrap3 input输入框插入glyphicon图标的方法
2016/05/16 Javascript
jQuery添加options点击事件并传值实例代码
2016/05/18 Javascript
JavaScript中对象的不同创建方法
2016/08/12 Javascript
vue2的todolist入门小项目的详细解析
2017/05/11 Javascript
vue 实现剪裁图片并上传服务器功能
2018/03/01 Javascript
vue-cli3.0 环境变量与模式配置方法
2018/11/08 Javascript
Python中使用logging模块代替print(logging简明指南)
2014/07/09 Python
Python中的tuple元组详细介绍
2015/02/02 Python
Python和Perl绘制中国北京跑步地图的方法
2016/03/03 Python
python面试题Python2.x和Python3.x的区别
2019/05/28 Python
使用Python画出小人发射爱心的代码
2019/11/23 Python
纯CSS3实现的8种Loading动画效果
2014/07/05 HTML / CSS
飞利浦西班牙官方网站:Philips西班牙
2020/02/17 全球购物
德国玩具商店:Planet Happy DE
2021/01/16 全球购物
2014年小学生迎国庆65周年演讲稿
2014/09/27 职场文书
恋恋笔记本观后感
2015/06/16 职场文书
nginx配置proxy_pass中url末尾带/与不带/的区别详解
2021/03/31 Servers
使用python向MongoDB插入时间字段的操作
2021/05/18 Python
TensorFlow的自动求导原理分析
2021/05/26 Python
mysql 索引合并的使用
2021/08/30 MySQL
Java 通过手写分布式雪花SnowFlake生成ID方法详解
2022/04/07 Java/Android