IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> (总结版)Javascript中的类型转换规则 以及 JS加法运算中的类型转换规则 -> 正文阅读

[JavaScript知识库](总结版)Javascript中的类型转换规则 以及 JS加法运算中的类型转换规则

一、其他值到布尔类型的值的转换规则

以下这些是假值:

? false
? undefined
? null
? +0-0NaN
? ""

假值的布尔强制类型转换结果为 false。从逻辑上说,假值列表以外的都应该是真值。

二、其他值到字符串的转换规则

  • Null 和 Undefined 类型 ,null 转换为 “null”,undefined 转换为 “undefined”,
  • Boolean 类型,true 转换为 “true”,false 转换为 “false”。
  • Number 类型的值直接转换,不过那些极小和极大的数字会使用指数形式。
  • Symbol 类型的值直接转换,但是只允许显式强制类型转换,使用隐式强制类型转换会产生错误,以下是例子:
let symbol = Symbol('name');
console.log(symbol);//Symbol(name)

// 1、显式转换(都可以实现)
// 1.1、调用String()函数
let result1 = String(symbol);
console.log(typeof result1);//'string'
console.log(result1);//'Symbol(name)'

// 1.2、调用toSting()函数
let result2 = symbol.toString();
console.log(typeof result2);//'string'
console.log(result2);//'Symbol(name)'

// 2、隐式转换(报错)
/*
  01.html:26 Uncaught TypeError: Cannot convert a Symbol value to a string at 01.html:26
 */
let result3 = symbol + '';
console.log(typeof result3);
console.log(result3);
  • 对普通对象来说,除非自行定义 toString() 方法,否则会调用 toString()(Object.prototype.toString())来返回内部属性 [[Class]] 的值,如"[object Object]"。如果对象有自己的 toString() 方法,字符串化时就会调用该方法并使用其返回值,以下是例子:
 // 1、未改写字符串显时转换方法的结果
 let obj1 = {};
 let result1 = String(obj1);
 console.log(result1);//'[object Object]'

 let obj2 = {
   name: 'miracle',
   age: 21
 }
 let result2 = obj2.toString();
 console.log(result2);//'[object Object]'

 // 2、改写字符串隐式转换方法后的结果
 Object.prototype.toString = function() {
   return '我是改写字符串转换方法后的结果';
 }
 let result3 = obj2.toString();
 console.log(typeof result3);//'string'
 console.log(result3);//'我是改写字符串转换方法后的结果'
  • 对于数组而言,转换成字符串,是以下这种结果:
let arr1 = [];
let result1 = String(arr1);
console.log(typeof result1);//'string'
console.log(result1);//''

let arr2 = [1];
let result2 = String(arr2);
console.log(typeof result2);//'string'
console.log(result2);//'1'

let arr3 = [1, 2];
let result3 = String(arr3);
console.log(typeof result3);//'string'
console.log(result3);//'1,2'

// 当数组最后有连续两个及以上逗号时,该数组转换成字符串时,会去掉最后一个逗号,如下
let arr4 = [,,,];
let result4 = String(arr4);
console.log(typeof result4);//'string'
console.log(result4);//',,'

let arr5 = [,,1,,];
let result5 = String(arr5);
console.log(typeof result5);//'string'
console.log(result5);//',,1,'

三、 其他值到数字值的转换规则

  • Undefined 类型的值转换为 NaN。
  • Null 类型的值转换为 0。
  • Boolean 类型的值,true 转换为 1,false 转换为 0。
  • String 类型的值转换如同使用 Number() 函数进行转换,如果包含非数字值则转换为 NaN,空字符串为 0, 以下是例子:
let str1 = '';
let result1 = Number(str1);
console.log(typeof result1);//'number'
console.log(result1);//0

let str2 = 'miracle';
let result2 = Number(str2);
console.log(typeof result2);//'number'
console.log(result2);//NaN
  • Symbol 类型的值不能转换为数字,会报错,Symbol类型目前只能显式转字符串。
  • 对象(包括数组)会首先被转换为相应的基本类型值,如果返回的是非数字的基本类型值,则再遵循以上规则将其强制转换为数字,以下是例子:
//1、对象
let result3 = Number(null);
console.log(result3);//0

let obj1 = {
  name: 'miracle',
  age: 21
}
let result1 = Number(obj1);
console.log(result1);//NaN

let obj2 = {};
let result2 = Number(obj2);
console.log(result2);//NaN

//2、数组
let arr1 = [];
let result1 = Number(arr1);
console.log(result1);//0

let arr2 = [1];
let result2 = Number(arr2);
console.log(result2);//1

let arr3 = [1,2];
let result3 = Number(arr3);
console.log(result3);//NaN

为了将值转换为相应的基本类型值,抽象操作 ToPrimitive 会首先(通过内部操作 DefaultValue)检查该值是否有valueOf()方法。如果有并且返回基本类型值,就使用该值进行强制类型转换。如果没有就使用 toString() 的返回值(如果存在)来进行强制类型转换。

如果 valueOf() 和 toString() 均不返回基本类型值,会产生 TypeError 错误

四、实用的类型转换表

原始值转化为数值类型转化为字符串类型转化为 Boolean 类型
false0“false”false
true1“true”true
00“0”false
11“1”true
“0”0“0”true
“1”1“1”true
NaNNaN“NaN”false
InfinityInfinity“Infinity”true
-Infinity-Infinity“-Infinity”true
“”0“”false
“20”20“20”true
“twenty”NaN“twenty”true
[ ]0“”true
[20]20“20”true
[10,20]NaN“10,20”true
[“twenty”]NaN“twenty”true
[“ten”,”twenty”]NaN“ten,twenty”true
function(){}NaN“function(){}”true
{ }NaN“[object Object]”true
null0“null”false
undefinedNaN“undefined”false

五、JS加法运算中的类型转换规则

1、解析视频
https://www.bilibili.com/video/BV1fJ411M7GW?from=search&seid=4048426098149042798

2、补充说明
视频中,有错误的地方,纠正如下:

let result9 = {} + [];
console.log(result9);//'[object Object]'

let result10 = [] + {};
console.log(result10);//'[object Object]'

let result11 = + [];
console.log(typeof result11);//'number'
console.log(result11);//0
  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2021-08-29 21:50:40  更:2021-08-29 21:50:53 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/23 13:30:20-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码