浅析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 相关文章推荐
HTML node相关的一些资料整理
Jan 01 Javascript
js简单的点击返回顶部效果实现方法
Apr 10 Javascript
基于Bootstrap3表格插件和分页插件实例详解
May 17 Javascript
Textarea输入字数限制实例(兼容iOS&安卓)
Jul 06 Javascript
javascript Function函数理解与实战
Dec 01 Javascript
详解IOS微信上Vue单页面应用JSSDK签名失败解决方案
Nov 14 Javascript
其实你可以少写点if else与switch(推荐)
Jan 10 Javascript
Node.js原生api搭建web服务器的方法步骤
Feb 15 Javascript
微信小程序实现的picker多级联动功能示例
May 23 Javascript
JS实现网站吸顶条
Jan 08 Javascript
vue组件实现移动端九宫格转盘抽奖
Oct 16 Javascript
Vue3 Composition API的使用简介
Mar 29 Vue.js
浅析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/09/25 PHP
url decode problem 解决方法
2011/12/26 PHP
浅析get与post的一些特殊情况
2014/07/28 PHP
php使用正则表达式进行字符串搜索的方法
2015/03/23 PHP
php文件管理基本功能简单操作
2017/01/16 PHP
分享一个自己写的table表格排序js插件(高效简洁)
2011/10/29 Javascript
在标题栏显示新消息提示,很多公司项目中用到这个方法
2011/11/04 Javascript
ff下JQuery无法监听input的keyup事件的解决方法
2013/12/12 Javascript
js读写json文件实例代码
2014/10/21 Javascript
layer弹出层中H5播放器全屏出错的解决方法
2017/02/21 Javascript
Node 自动化部署的方法
2017/10/17 Javascript
Angular resolve基础用法详解
2018/10/03 Javascript
mocha的时序规则讲解
2019/02/16 Javascript
Easyui 关闭jquery-easui tab标签页前触发事件的解决方法
2019/04/28 jQuery
微信小程序在线客服自动回复功能(基于node)
2019/07/03 Javascript
Weex开发之地图篇的具体使用
2019/10/16 Javascript
[36:16]完美世界DOTA2联赛PWL S3 access vs Rebirth 第一场 12.19
2020/12/24 DOTA
wxpython 最小化到托盘与欢迎图片的实现方法
2014/06/09 Python
深入分析在Python模块顶层运行的代码引起的一个Bug
2014/07/04 Python
Python3访问并下载网页内容的方法
2015/07/28 Python
python下setuptools的安装详解及No module named setuptools的解决方法
2017/07/06 Python
Python类中的魔法方法之 __slots__原理解析
2019/08/26 Python
如何卸载python插件
2020/07/08 Python
利用HTML5中Geolocation获取地理位置调用Google Map API在Google Map上定位
2013/01/23 HTML / CSS
Html5+CSS3+EL表达式问题小结
2020/12/19 HTML / CSS
Spartoo芬兰:欧洲最大的网上鞋店
2016/08/28 全球购物
新三好学生主要事迹
2014/01/23 职场文书
致垒球运动员加油稿
2014/02/16 职场文书
单位绩效考核方案
2014/05/11 职场文书
高中综合实践活动总结
2014/07/07 职场文书
2014年学校工会工作总结
2014/12/06 职场文书
高中生综合素质自我评价
2015/03/06 职场文书
2015年采购员工作总结
2015/04/27 职场文书
导游词之开封禹王台风景区
2019/12/02 职场文书
解决pycharm安装scrapy DLL load failed:找不到指定的程序的问题
2021/06/08 Python
高通2023 年将发布高性能PC处理器
2022/04/29 数码科技