js类型转换与引用类型详解(Boolean_Number_String)


Posted in Javascript onMarch 07, 2014

一、类型转换

1.转换成字串
ECMAScript的Boolean值、数字和字串的原始值的有趣之处在于它们是伪对象,这意味着它们实际上具有属性和方法。
如:

var sColor = "blue";
alert(sColor.length);//outputs "4"

总而言之,3种主要的原始值Boolean值、数字和字串都有toString()方法。ECMAScript定义的所有对象都有toString()方法,无论它是伪对象,还是真的对象。

Boolean型的toString()方法只是输出"true"或"false",结果由变量的值决定:

var bFound = false;
alert(bFound.toString());//outputs "false"

Number类型的toString()方法比较特殊,它有两种模式,即默认模式和基模式,采用默认模式,toString()方法只是用相应的字符串输出数字值(无论是整数、浮点数还是科学记数法)。
var iNum1 = 10;
var fNum2 = 10.0;
alert(iNum1.toString()); //outputs "10"
alert(fNum2.toString()); //outputs "10"

采用Number类型的toString()方法的基模式,可以用不同的基(进制基数)输出数字。
var iNum = 10;
alert(iNum.toString(2));  //outputs "1010"
alert(iNum.toString(8));  //outputs "12"
alert(iNum.toString(16)); //outputs "A"

2.转换成数字
ECMAScript提供了两种把非数字的原始值转换成数字的方法,即parseInt()和parseFloat()。
注意:只有对String类型(Number除外)调用这些方法,才能正确运行对其他类型返回的都是NaN。

例如:

var iNum1 = parseInt("1234blue");//returns 1234
var iNum2 = parseInt("oxA"); //returns 10
var iNum3 = parseInt("22.5"); //returns 22
var iNum4 = parseInt("blue"); //returns NaN

parseInt()方法还有基模式,可以把二进制、八进制、十六进制或者其他任何进制的字符串转换成十进制整数。第二个参数指定按哪一种进制来解析。
var iNum1 = parseInt("AF",16);// returns 175
var iNum2 = parseInt("10",2); // returns 2
var iNum3 = parseInt("10",8); //returns 8
var iNum4 = parseInt("10",10); //returns 10

说明:如果十进制数包含前导0,那么最好采用基数10,否则得到的是八进制的值。
var iNum1 = parseInt("010");  // returns 8
var iNum2 = parseInt("010",8); //returns 8
var iNum3 = parseInt("010",10);//returns 10

parseFloat()方法与parseInt()方法的处理方式相似,从位置0开始查看每个字符,直到找到第一个非有效的字符为止,然后把该字符之前的字串转换成数字。对于这个方法来说,第一个出现的小数点是有效字符。如果用两个小数点,第二个小数点将被看作无效的。使用该方法的另一个不同之处在于,字串必须以十进制形式表示浮点数。
var fNum1 = parseFloat("1234blue"); //returns 1234.0
var fNum2 = parseFloat("0xA"); //returns NaN
var fNum3 = parseFloat("22.5"); //returns 22.5
var fNum4 = parseFloat("22.34.5");//returns 22.34
var fNum5 = parseFloat("0908");//returns NaN
var fNum6 = parseFloat("blue");//returns NaN

3.强制类型转换
ECMAScript中可用的3种强制类型转换如下:

(1).Boolean(value)
把给定的值转换成Boolean型。
当要转换的值是至少有一个字符的字符串、非0数字或对象时,Boolean()函数将返回true。如果该值是空字符串、数字0、undefined或null,它将返回false。
如:

var b1 = Boolean(""); // false;
var b2 = Boolean("hi");//true
var b3 = Boolean(100);//true
var b4 = Boolean(null);//false
var b5 = Boolean(0);//false
var b6 = Boolean(new Object());//true

(2).Number(value)
把给定的值转换成数字(可以是整数或浮点数)。
还记得parseInt()和parseFloat()方法只转换第一个无效字符之前的字符串,因此"4.5.6"将被转换为"4.5"。用Number()进行强制类型转换,"4.5.6"将返回NaN,因为整个字符串值不能转换成数字。如果字符串能被完整地转换,Number()将判断是调用parseInt()方法还是调用parseFloat()方法。
如:
Number(false);//0
Number(true);//1
Number(undefined);//NaN
Number(null);//0
Number("5.5");//5.5
Number("56");//56
Number("5.6.7");//NaN
Number(new Object());//NaN
Number(100);//100

(3).String(value)
把给定的值转换成字串。
与调用toString()方法的唯一不同之处在于,对null或undefined值强制类型转换可以生成字符串而不引发错误:
var s1 = String(null);//"null"
var oNull = null;
var s2 = oNull.toString();//causes an error

二、引用类型
引用类型通常叫作类(class),也就是说,遇到引用值时,所处理的就是对象。ECMAScript定义了“对象定义”,逻辑上等价于其他程序设计语言中的类。

1.Object类
ECMAScript中的所有类都由这个类继承而来,Object类中的所有属性和方法都会出现在其他类中(被覆盖)。

Object类的属性:

(1).Constructor----对创建对象的函数的引用(指针)。对于Object类,该指针指向原始的object()函数。

(2).Prototype----对该对象的对象原型的引用。对于所有的类,它默认返回Object对象的一个实例。

Object类的方法:

(1).HasOwnProperty(property)----判断对象是否有某个特定的属性。必须用字符串指定该属性(例如:o.hasOwnProperty("name"))。

(2).IsPrototypeOf(object)----判断该对象是否为另一个对象的原型。

(3).PropertyIsEnumerable(property)----判断给定的属性是否可以用for..in语句进行枚举。

(4).ToString()----返回对象的原始字符串表示。不同的ECMAScript实现具有不同的值。

(5).ValueOf()----返回最适合该对象的原始值。对于许多类,该方法返回的值都与toString()的返回值相同。

2.Boolean类
在ECMAScript中很少使用Boolean对象,即使使用,也不易理解。
例如:

var oFalseObject  = new Boolean(false);
var bResult = oFalseObject  && true;//outputs  true;

原因:在Boolean表达式中,所有对象都会被自动转换为true。

3.Number类
Number.MAX_VALUE等等特殊值都Number类的静态属性。要得到数字对象的Number原始值,只需要使用valueOf()方法:
var iNumber = oNumberObject.valueOf();
除从Object类继承的标准方法外,Number类还有几个处理数值的专用方法。

toFixed()方法:
返回的是具有指定位数小数的数字的字符串表示。方法能表示具有0到20位小数的数字,超出这个范围的值会引发错误。
如:

var oNumberObject = new Number(99);
aler(oNumberObject.toFixed(2));//outputs "99.00"

toExponential()方法:
返回的是用科学记数法表示的数字的字符串形式。该方法也有一个参数,指定要输出的小数的位数。例如:
var oNumberObj = new Number(99);
alert(oNumberObj.toExponential(1));//outputs "9.9e+1"

toPrecision()方法:
根据最有意义的形式来返回数字的预定形式或指数形式。它有一个参数,即用于表示数的数字总数(不包括指数)。
var oNumberObj = new Number(99);
alert(oNumberObj.toPrecision(1));//outputs "1e+2" ==100

可以看出,toPrecision()方法会对数进行舍入,从而得到尽可能接近真实值的数。
如:
var oNumberObj = new Number(99);
alert(oNumberObj.toPrecision(2));// outputs "99"
alert(oNumberObj.toPrecision(3));// outputs "99.0"

toFixed()、toExponential()和toPrecision()方法都会进行舍入操作,以便用正确的小数位数正确地表示一个数。

toLocaleString()方法:
可以在页面上格式显示,如5210.50显示为5,210.50,但是如果在使用其值时,应该用parseFloat($("N_YJJE").value.replace(//,/g, ""));的形式替换掉逗号,后得到其值。

注意:与Boolean对象相似,Number对象也很重要,不过应该少用这种对象,以避免发生潜在的问题。只要可能,都使用数字的原始表示法。

4.String类
String对象的valueOf()方法和toString()方法都会返回String型的原始值:

alert(oStringObj.valueOf() == oStringObj.toString());//outputs "true"

String类具有属性length,它是字符串的字符个数:
var oStringObj = new String("hello world");
alert(oStringObj.length);outputs "11"

注意:即使字符串包含双字节的字符,每个字符也只算一个字符。

charAt()方法:
返回的是包含指定位置处的字符的字符串:

var oStringObj = new String("hello world");
alert(oStringObj.charAt(1));outputs "e"

charCodeAt()方法:
返回的是包含指定位置处的字符代码的字符串:
var oStringObj = new String("hello world");
alert(oStringObj.charCodeAt(1));outputs "101"

concat()方法:
用于把一个或多个字符串连接到String对象的原始值上。原String对象不变。
var oStringObj = new String("hello ");
var sResult = oStringObj.concat("world");//oStringObj+"world";更常见
alert(sResult);//outputs "hello world"
alert(oStringObj);//outputs "hello"

indexOf()和lastIndexOf()方法返回的都是指定的子串在另一个字符串中的位置(或-1,如果没有找到这个子串)。这两个方法的不同之处大于,indexOf()是从字串的开头(位置0)开始检索子串,而lastIndexOf()则是从字串的结尾开始检索子串的。

localeCompare(),对字符串进行比较(按照字母顺序比较,越后越大)。该方法有一个参数--要进行比较的字符串,返回的是下列3个值之一:
1.如果String对象按照字母顺序排在参数中的字符串之前,返回负数(最常见的是-1,不过真正的返回由实现决定的)。
2.如果String对象等于参数中的字符串,返回0。
3.如果String对象按照字母顺序排在参数中的字符串之后,返回正数(最常见的是1,不过真正的返回由实现决定的)

slice()和substring()方法:
这两个方法返回的都是要处理的字符串的子串,都接受一个或两个参数。第一个参数是要获取的子串的起始位置,第二个参数是要获取子串终止前的位置(终止位置处的字符不包括大返回的值内)。如果省略第二个参数,终止位就默认为字符串的长度。这两个方法都不改变String对象自身的值。

var oStringObj = new String("hello world");
alert(oStringObj.slice(3));//outputs "lo world"
alert(oStringObj.slice(3,7));//outputs "lo w"

注意:对于负数参数,slice()方法会用字符串的长度加上参数,substring()方法则将其作为0处理(也就是说将忽略它)。
var oStringObj = new String("hello world");
alert(oStringObj.slice(-3));//outputs "rld"相当于反向取
alert(oStringObj.substring(-3));//outputs "hello world"
alert(oStringObj.slice(3,-4));//outputs "lo w"
alert(oStringObj.substring(3,-4));//outputs "hel" substring()总是把较小的数字作为起始位,较大的数字作为终止位。

toLowerCase()、toLocalLowerCase()、toUpperCase()和toLocaleUpperCase():
前两种方法把字符串转换成全小写的,后两种方法用于把字符串转换成全大写的。toLocalLowerCase()和toLocaleUpperCase()方法是基于特定区域实现的。

记住:String类的所有属性和方法都可应用于String原始值上,因为它们是伪对象。

5.instanceof运算符
在使用typeof运算符时采用引用类型存储值会出现一个问题,无论引用的是什么类型的对象,它都返回"object"。instanceof方法要示开发者明确地确认对象为某特定类型。如:

var oStrObj = new String("hello world");   
alert(oStrObj instanceof String);//outputs "true"
Javascript 相关文章推荐
Dom在ajax技术中的作用说明
Oct 25 Javascript
JQury slideToggle闪烁问题及解决办法
Jul 05 Javascript
jQuery验证Checkbox是否选中的代码 推荐
Sep 04 Javascript
利用jQuery插件扩展识别浏览器内核与外壳的类型和版本的实现代码
Oct 22 Javascript
js window.print实现打印特定控件或内容
Sep 16 Javascript
javascript 动态脚本添加的简单方法
Oct 11 Javascript
jquery 判断是否支持Placeholder属性的方法
Feb 07 Javascript
linux 后台运行node服务指令方法
May 23 Javascript
JS栈stack类的实现与使用方法示例
Jan 31 Javascript
vue日历/日程提醒/html5本地缓存功能
Sep 02 Javascript
layui prompt 设置允许空白提交的方法
Sep 24 Javascript
使用vuex较为优雅的实现一个购物车功能的示例代码
Dec 09 Javascript
JS调试必备的5个debug技巧
Mar 07 #Javascript
javascript中style.left和offsetLeft的用法说明
Mar 07 #Javascript
js读取被点击次数的简单实例(从数据库中读取)
Mar 07 #Javascript
js函数名与form表单元素同名冲突的问题
Mar 07 #Javascript
javascript(js)的小数点乘法除法问题详解
Mar 07 #Javascript
jquery中常用的函数和属性详细解析
Mar 07 #Javascript
jquery 操作两个select实现值之间的互相传递
Mar 07 #Javascript
You might like
Yii框架中memcache用法实例
2014/12/03 PHP
php求一个网段开始与结束IP地址的方法
2015/07/09 PHP
php实现可运算的验证码
2015/11/10 PHP
Zend Framework框架路由机制代码分析
2016/03/22 PHP
Laravel5.5 数据库迁移:创建表与修改表示例
2019/10/23 PHP
asp.net HttpHandler实现图片防盗链
2009/11/09 Javascript
图片onload事件触发问题解决方法
2011/07/31 Javascript
jquery实现页面常用的返回顶部效果
2016/03/04 Javascript
JavaScript中split与join函数的进阶使用技巧
2016/05/03 Javascript
BootStrap的alert提示框的关闭后再显示怎么解决
2016/05/17 Javascript
input 禁止输入特殊字符的四种实现方式
2016/08/24 Javascript
浅析上传头像示例及其注意事项
2016/12/14 Javascript
JS实现弹出下载对话框及常见文件类型的下载
2017/07/13 Javascript
实例讲解JavaScript截取字符串
2018/11/30 Javascript
NodeJS实现一个聊天室功能
2019/11/25 NodeJs
Vue组件模板的几种书写形式(3种)
2020/02/19 Javascript
vue实现移动端项目多行文本溢出省略
2020/07/29 Javascript
Python标准库os.path包、glob包使用实例
2014/11/25 Python
python数组过滤实现方法
2015/07/27 Python
Python Selenium Cookie 绕过验证码实现登录示例代码
2018/04/10 Python
python3.6的venv模块使用详解
2018/08/01 Python
用python实现k近邻算法的示例代码
2018/09/06 Python
python3 线性回归验证方法
2019/07/09 Python
python在OpenCV里实现投影变换效果
2019/08/30 Python
Python使用贪婪算法解决问题
2019/10/22 Python
python实现二分类的卡方分箱示例
2019/11/22 Python
matplotlib bar()实现百分比堆积柱状图
2021/02/24 Python
CSS3实现菜单悬停效果
2020/11/17 HTML / CSS
基于Html5实现的react拖拽排序组件示例
2018/08/13 HTML / CSS
使用 HTML5 Canvas 制作水波纹效果点击图片就会触发
2014/09/15 HTML / CSS
什么是Smart Navigation?
2016/07/03 面试题
银行柜员应聘推荐信范文
2013/11/24 职场文书
会计助理的岗位职责
2013/11/29 职场文书
学习党章思想汇报
2014/01/07 职场文书
县政协领导班子群众路线教育实践活动四风问题整改方案
2014/10/26 职场文书
Python爬虫进阶之Beautiful Soup库详解
2021/04/29 Python