JavaScript中的值类型转换介绍

在JavaScript中进行+、-、*、/、==、!=等运算时，如果操作符左右两边的值类型与预期类型不一致，JavaScript会将操作符两边的值转换成预期的类型后再进行操作。预期值类型为string时，JavaScript会将值转换为string；预期值类型为number时，JavaScript会将值转换为number (如果无法转换为数值，则返回NaN)比如：

代码如下:

console.log(10 + " cats");//10 cats
console.log(10 * " cats");//NaN, " cats" will be converted to NaN
console.log(10 + "2");//102
console.log(10 - "2");//8
console.log(10 / "2");//5
console.log(10 * "2");//20
console.log(10 * " 2");//20
console.log("10" * "2");//20

值类型转换规则

JavaScript中的值转换规则可以参考“JavaScript – The Definitive Guide”一书中的Table 3-2. JavaScript type conversions。比较值得注意的一些地方是：

1.undefined转换成number后结果为NaN。
2.null转换成number后结果为0。
3.空字符串”"转换成number后结果为0。
4.-0转换成string后结果为”0″。
5.空数组[]转换成number后结果为0。
6.仅有一个number成员的数组(如[9])转换成number后结果为该numer值(9)。

当JavaScript将string转换成number时，有两个比较有趣的规则：

1.JavaScript会将字符串开头和结尾处的空白字符删除后再进行转换，因此像” 42 “这样的字符串可以顺利的被转换成数字42。

2.删除开头和结尾处的空白字符后，如果字符串中依然包含非数字字符，那么该字符串会被转换成NaN。比如：”3 m”就会被转换成NaN。

实例：

代码如下:

console.log(10 * " 3 ");//30
console.log(10 * "3 m");//NaN, "3 m" will be converted to NaN

值类型转换与比较

在JavaScript中，等于操作符(==)的使用会涉及到值类型转换：如果==操作符两边的值类型不一致，那么JS会将它们转换成一致的类型后再加以判断。需要小心的是，两个不同类型的值，经过类型转换后也许可以等价，但这并不意味着对它们使用==操作符的结果就一定为true。一个简单的例子是undefined和false：将undefined转换成boolean类型后结果刚好为false，但事实上undefined==false的结果却为false。

显式类型转换

使用JavaScript的类型自动转换非常便捷，但同时也很容易带来诸如代码可维护性等问题。为了使程序代码更加清晰、减少歧义，有时会在JS程序中使用显式类型转换：

代码如下:

Number("3")//3
String(false)//"false"
Boolean([])//true

大多数情况下，显式类型转换的结果与JS自动类型转换的结果是一致的；但存在1个特例：当将null或者undefined自动转换成Object时，JS将抛出TypeError错误；但当显式地将null或者undefined转换成Object时，JS将返回一个空的对象：

代码如下:

console.log(Object(undefined));//empty object
console.log(Object(null));//empty object

同时，如果显式转换所指定的类型与JS自动转换所指定的类型不一样，那么，得到的结果也不一样。比如之前所提及的undefined==false结果为false；如果显式指定转换类型为Boolean，那么得到的结果就为true了：

代码如下:

console.log(undefined == false);//false
console.log(Boolean(undefined) == Boolean(false));//true

对类型自动转换的使用

在JS中，可以使用值类型的自动转换，通过操作符来达到和显式转换一样的效果，比如：

代码如下:

console.log(false + "");//"false"
console.log(+false);//0
console.log(!!3);//true

赞 (0)

相关推荐

  • js中的值类型和引用类型小结 文字说明与实例

    一.拥抱JavaScript 曾经名不经传的JavaScript随着AJAX的流行而身价倍增,现在JavaScript不再仅仅是WEB开发中一个可有可无的辅助工具,甚至有了专门属于它的职位"JavaScript工程师",那怕你仅仅是一名WEB后台开发程序员,你都必须了解JavaScript,至少在一些相关招聘职位要求上你可以看到"熟悉JavaScript优先"的字眼.甚至我还要告诉你,你将可以用JavaScript开发桌面软件,这得益于Adobe AIR的另外一种开

  • JS正则表达式匹配检测各种数值类型(数字验证)

    验证数字的正则表达式集 验证数字:^[0-9]*$ 验证n位的数字:^\d{n}$ 验证至少n位数字:^\d{n,}$ 验证m-n位的数字:^\d{m,n}$ 验证零和非零开头的数字:^(0|[1-9][0-9]*)$ 验证有两位小数的正实数:^[0-9]+(.[0-9]{2})?$ 验证有1-3位小数的正实数:^[0-9]+(.[0-9]{1,3})?$ 验证非零的正整数:^\+?[1-9][0-9]*$ 验证非零的负整数:^\-[1-9][0-9]*$ 验证非负整数(正整数 + 0) ^\d

  • JavaScript中的值类型详细介绍

    计算机程序的实质很大程度上可以说是机器对各种信息(值)的操作与读写.在JavaScript中,存在多种类型的值,这些值分成两大类:Primitive(基本类型)和Object(对象). Primitive JavaScript中Primitive有5种类型: 1.Number.所有的数字,无论是整数还是小数,均为Number类型. 2.String.字符串类型. 3.Boolean.布尔类型,true或者false. 4.null.此类型只有null一个值. 5.undefined.此类型只有u

  • JavaScript基本数据类型及值类型和引用类型

    在JavaScript中四种基本的数据类型:数值(整数和实数).字符串型(用""号或''括起来的字符或数值).布尔型(使True或False表示)和空值.在JavaScript的基本类型中的数据可以是常量,也可以变量.由于JavaScript采用弱类型的形式,因而一个数据的变量或常量不必首先作声明,而是在使用或赋值时确定其数据的类型的.当然也可以先声明该数据的类型,它是通过在赋值时自动说明其数据类型的. javascript中的变量 javascript中的变量只是一个占位符,前言已经

  • JavaScript中如何判断一个值的类型

    我们知道在js中有一个运算符可以帮助我们判断一个值的类型,它就是typeof运算符. console.log(typeof 123); //number console.log(typeof '123'); //string console.log(typeof true); //boolean console.log(typeof undefined); //undefined console.log(typeof null); //object console.log(typeof []);

  • javascript限制文本框输入值类型的方法

    本文实例讲述了javascript限制文本框输入值类型的方法.分享给大家供大家参考.具体分析如下: 要求:所有的文本框,只能输入数字和小数点,其他的符号一概不能输入: 重点是我希望在用户输入时就做限制,而不是提交时判断--也就是说如果用户在文本框内输入数字或小数点,可以正常输入:如果输入字母等非数字字符,则文本框会没有任何反应,不会显示输入的字符. <html> <body> <script> var s = "<input type=\"te

  • JavaScript中值类型与引用类型实例说明

    复制代码 代码如下: <script type="text/javascript"> var str = 'abced'; var obj = new String(str); function newToString() { return 'hello,world'; } function func(val) { val.toString = newToString; } func(str); //ps:实际只传入了str的值,因此对它的toString修改是无意义的 传

  • JavaScript中值类型和引用类型的区别

    JavaScript中值类型和引用类型的区别

    JavaScript的数据类型分为两类:原始类型和对象类型.其中,原始类型包括:数字.字符串和布尔值.此外,JavaScript中还有两个特殊的原始值:null和undefined,它们既不是数字也不是字符串,更不是布尔值.它们通常分别代表了各自特殊类型的唯一成员.JavaScript中除了数字.字符串.布尔值.null和undefined之外的就是对象了. JavaScript中值类型和引用类型的区别 JavaScript中的值类型的值是不可变的: 任何方法都无法改变值类型的值.数字.布尔值.

  • JavaScript中的值类型转换介绍

    在JavaScript中进行+.-.*./.==.!=等运算时,如果操作符左右两边的值类型与预期类型不一致,JavaScript会将操作符两边的值转换成预期的类型后再进行操作.预期值类型为string时,JavaScript会将值转换为string:预期值类型为number时,JavaScript会将值转换为number (如果无法转换为数值,则返回NaN)比如: 复制代码 代码如下: console.log(10 + " cats");//10 cats console.log(10

  • 详解JavaScript中的强制类型转换

    avaScript 原语 JavaScript 建立在一系列基本单元之上.你应该对其中的一些已经很熟悉了,比如字符串和数字: var greet = "Hello"; var year = 89; 字符串和数字是该语言所谓"原语"的一部分.完整清单是: String Number Boolean Null Undefined Object Symbol (ES6中添加,此处不予介绍) 布尔值用来表示可能是真或假的值. null 是故意不去赋值,它通常被分配给一个变量

  • JavaScript中原始值和引用值深入讲解

    JavaScript中原始值和引用值深入讲解

    目录 值和引用相关内容 1. 简单值(原始值) 2. 复杂值(引用值) 3. 访问方式 4. 比较方式 5. 动态属性 6. 变量赋值 灵魂拷问 总结 值和引用相关内容 在 JavaScript 中,数据类型整体上来讲可以分为两大类:基本类型和引用数据类型 基本数据类型,一共有 6 种: string,symbol,number,boolean,undefined,null 其中 symbol 类型是在 ES6 里面新添加的基本数据类型. 引用数据类型,就只有 1 种: object 基本数据类

  • JavaScript中的ArrayBuffer详细介绍

    JavaScript中的ArrayBuffer详细介绍

    相信每一个 javascript 学习者,都会去了解 JS 的各种基本数据类型,数组就是数据的组合,这是一个很基本也十分简单的概念,他的内容没多少,学好它也不是件难事情.但是本文着重要介绍的并不是我们往常看到的 Array,而是 ArrayBuffer. 我写的很多东西都是因为要完成某些特定的功能而刻意总结的,可以算是备忘,本文也是如此!前段时间一直在研究 Web Audio API 以及语音通信相关的知识,内容侧重于音频流在 AudioContext 各个节点之间的流动情况,而现在要摸清楚音频

  • JavaScript中的操作符==与===介绍

    JavaScript中,==与===操作符均可用于判断两个值是否相等:不同之处在于,如果进行判断的两个值类型不一致,===操作符会直接返回false,而==操作符则会在类型转换后再进行判断.详细的判断规则如下: ===操作符的判断规则 1.如果两个值的类型不一致,返回false. 2.如果两个值的类型一致,值一致,返回true.NaN是一个特例,NaN===NaN返回false. 3.如果两个值均为object类型,那么与Java一样,除非两者引用一致(reference指向同一个对象地址),不

  • JavaScript中内存泄漏的介绍与教程（推荐）

    JavaScript中内存泄漏的介绍与教程（推荐）

    本文主要给大家详细介绍了关于JavaScript中内存泄漏的相关内容,文中介绍的非常详细,对大家具有一定的参考学习价值,下面来一起看看详细的介绍: 一.什么是内存泄漏? 程序的运行需要内存.只要程序提出要求,操作系统或者运行时(runtime)就必须供给内存. 对于持续运行的服务进程(daemon),必须及时释放不再用到的内存.否则,内存占用越来越高,轻则影响系统性能,重则导致进程崩溃. 不再用到的内存,没有及时释放,就叫做内存泄漏(memory leak). 有些语言(比如 C 语言)必须手动

  • Javascript中的call()方法介绍

    在Mozilla的官网中对于call()的介绍是: 复制代码 代码如下: call() 方法在使用一个指定的this值和若干个指定的参数值的前提下调用某个函数或方法. Call() 语法 复制代码 代码如下: fun.call(thisArg[, arg1[, arg2[, ...]]]) Call() 参数 thisArg 复制代码 代码如下: 在fun函数运行时指定的this值.需要注意的是,指定的this值并不一定是该函数执行时真正的this值,如果这个函数处于非严格模式下,则指定为nul

  • JavaScript中的数学运算介绍

    JavaScript中,数学运算可藉由两种操作来实现: 1.+.-.*./.%等操作符. 2.使用Math对象的计算函数.比如,用Math.pow(2,3)来计算2的3次方. 与Java不同,JavaScript中的数学运算不会抛出任何错误.计算结果的溢出.除以0.对负数进行开方这些操作都是合法的,其结果为JavaScript中的特殊值:正负Infinity(无限).正负0.NaN(非数): 1.正负Infinity.当计算结果比JavaScript所能表示的最大数(Number.MAX_VAL

  • Javascript中的包装类型介绍

    Javascript中的包装类型介绍

    最近不看犀牛书了,那本翻译的特烂而且好拗口,尤其是原型那块说的乱七八糟,后来经同事介绍,买了本js高级程序设计,然后就继续苦逼的看,不吐槽了,继续说说js中有新鲜感的包装类型.  一:String 说到String类型,蛮有意思,平时我们都是这样定义一个string类型,如下图: 但是在js中有一点非常特别,那就是string类型是属于基本类型,不属于引用类型,那就说明string的值是保存在"栈"上面的,而很多语言不是这样,比如C#,我觉得js不作为引用类型也是情有可原,毕竟它玩不了

随机推荐