你掌握了吗?——js数据类型隐式转换(上)

简介: 众所周知javascript是一种弱类型语言。强类型和弱类型主要是站在变量类型处理的角度进行分类的。强类型是一旦指定数据类型,如果不经过强制转换,那么将永远是指定的这个类型。js中无法声明数据类型,变量类型是根据实际值决定的,由编译器自动调用转换函数进行转换,这种方式称之为隐式转换,今天我们就来谈谈数据类型是如何隐式转换的。

js数据类型隐式转换


前言


众所周知javascript是一种弱类型语言。强类型和弱类型主要是站在变量类型处理的角度进行分类的。强类型是一旦指定数据类型,如果不经过强制转换,那么将永远是指定的这个类型。js中无法声明数据类型,变量类型是根据实际值决定的,由编译器自动调用转换函数进行转换,这种方式称之为隐式转换,今天我们就来谈谈数据类型是如何隐式转换的。


js数据类型


js数据类型共7种,包括6种基本数据类型,分别是Undefined、Null、String 、Number、Boolean、以及ES6新增的数据类型Symbol,一种复杂数据类型Object。


  • Undefined 只有一个值就是undefined,表示未经初始化的变量值


  • Null 只有一个值null,null值表示空对象指针


  • String 表示零个或多个16位的Unicode字符组成的字符序列


  • Number 包括整数和浮点数


  • Boolean 有两个字面值:true和false,表示一个逻辑实体


  • Symbol 每次创建的值都是唯一的,不能被强制转换


  • Object 复杂数据类型


js引擎内部实现类型转换的4个抽象操作


隐式类型转换是在一定场景下,js运行环境自动调用这几个方法,尝试转换成期望的数据类型


  • ToString(argument)


  • ToNumber(argument)


  • ToBoolean(argument)


  • ToPrimitive(input[ , PreferredType])


ToPrimitive(input[, PreferredType])


将input对象转成原始类型值,依赖valueOf()和toString()

PreferredType参数是Number,则ToPrimitive执行顺序:


  1. input本身是原始类型,返回input。


  1. 调用input.valueOf(),如果结果是原始类型,则返回这个结果。


  1. 调用input.toString(),如果结果是原始类型,则返回这个结果。


  1. 抛出TypeError异常。


PreferredType 参数是String,ToPrimitive执行顺序:


  1. input本身是原始类型,返回input。


  1. 调用input.toString(),如果结果是原始类型,则返回这个结果。


  1. 调用input.valueOf(),如果结果是原始类型,则返回这个结果。


  1. 抛出TypeError异常。


PreferredType没有传入参数


  • 如果input是内置的Date类型,PreferredType视为String


  • 否则PreferredType视为Number


ToBoolean(argument)


Argument Type Result
Undefined false
Null false
Boolean return argument
Number 仅当argument参数是 +0, -0, or NaN时,return false;否则return true
String 仅当argument参数是 空字符串时,return false;否则return true
Symbol true
Object true


ToNumber(argument)


Argument Type Result
Undefined NaN
Null +0
Boolean argument 为 true, return 1; argument 为 false, return 0
Number return argument参数
String 将字符串中的内容转化为数字(比如"23"->23),如果转化失败则返回NaN(比如"23a"->NaN)
Symbol 抛出 TypeError 异常
Object 先primValue = ToPrimitive(argument, Number),再对primValue使用ToNumber(primValue)


ToString(argument)


Argument Type Result
Undefined "undefined"
Null "null"
Boolean argument 为 true, return "true"; argument 为 false, return "false"
Number 用字符串表示数字
String 返回argument
Symbol 抛出 TypeError 异常
Object 先primValue = ToPrimitive(argument, Number),再对primValue使用ToString(primValue)


常见的隐式类型转换


转成String类型


  • 字符串连接符(+)转成字符串


var a = 123
var n = a + 'helloworld';
console.log(n)   // '123hellowold'
a = true
var m = a + 'helloworld'
console.log(m)   // 'truehelloworld'


转成Number型


  • 自增自减运算符 ++/--


  • 加减乘除求余算数运算符 +-*/%


var a = '100'
var b = a--
var c = a/2
console.log(b) // 100
console.log(a) // 99
a+= ''
console.log(c) // 49.5


相关文章
|
19天前
|
JavaScript 前端开发
js变量的作用域、作用域链、数据类型和转换应用案例
【4月更文挑战第27天】JavaScript 中变量有全局和局部作用域,全局变量在所有地方可访问,局部变量只限其定义的代码块。作用域链允许变量在当前块未定义时向上搜索父级作用域。语言支持多种数据类型,如字符串、数字、布尔值,可通过 `typeof` 检查类型。转换数据类型用 `parseInt` 或 `parseFloat`,将字符串转为数值。
18 1
|
19天前
|
存储 JavaScript 前端开发
【JavaScript技术专栏】JavaScript基础入门:变量、数据类型与运算符
【4月更文挑战第30天】本文介绍了JavaScript的基础知识,包括变量(var、let、const)、数据类型(Number、String、Boolean、Undefined、Null及Object、Array)和运算符(算术、赋值、比较、逻辑)。通过实例展示了如何声明变量、操作数据类型以及使用运算符执行数学和逻辑运算。了解这些基础知识对初学者至关重要,是进阶学习JavaScript的关键。
|
17天前
|
存储 前端开发 JavaScript
JavaScript数据类型归纳,架构师花费近一年时间整理出来的前端核心知识
JavaScript数据类型归纳,架构师花费近一年时间整理出来的前端核心知识
JavaScript数据类型归纳,架构师花费近一年时间整理出来的前端核心知识
|
19天前
|
存储 JavaScript 前端开发
JavaScript引用数据类型
JavaScript引用数据类型
|
19天前
|
JavaScript 前端开发
JavaScript 基本数据类型
JavaScript 基本数据类型
|
19天前
|
JavaScript 前端开发
【Web 前端】JS中检测数据类型的有哪些?
【4月更文挑战第22天】【Web 前端】JS中检测数据类型的有哪些?
|
19天前
|
存储 前端开发 JavaScript
【Web 前端】JS数据类型有哪些?区别?
【4月更文挑战第22天】【Web 前端】JS数据类型有哪些?区别?
|
19天前
|
存储 JavaScript 前端开发
JavaScript的数据类型主要分为两大类:基本数据类型和引用数据类型
【4月更文挑战第20天】JavaScript的数据类型主要分为两大类:基本数据类型和引用数据类型
25 6
|
19天前
|
JavaScript 前端开发
js数据类型有几类?一共有几种?判断数据类型的方法是什么?
js数据类型有几类?一共有几种?判断数据类型的方法是什么?
|
19天前
|
JavaScript 前端开发
JavaScript的数据类型
JavaScript的数据类型
13 4