网站首页 > 技术文章 正文
强制类型转换:
强制类型转换:指将其他的数据类型转换为string、number、boolean
将其他数据类型转换为字符串String():
方法一:
- 可以通过调用被转换值的toString()方法来将其转换为字符串
- 调用xxx的yyy方法 --> xxx.yyy()
- 转换的原理:实际上根据原来的值创建出一个新值
- toString()只是根据原来的值,创建一个新的字符串并返回,
不会改变原来的值
- 要改变变量中存储的值,必须要对变量进行重新赋值
- 注意:由于在null和undefined中,不存在toString()方法,
所以如果对null和undefined调用toString()会报错
方法二:
- 可以通过调用String()函数,来将其他类型的值转换为字符串
- 调用xxx函数,--> xxx()
- String()的原理:
对于具有toString()方法的值来说,String()会直接调用它们的
toString()来将其转换为字符串
对于没有toString()方法的null和undefined来说,
null 会直接 转换为 'null'
undefined 会直接 转换为 'undefined'
方法二函数方法更加实用,建议实用String()函数方法!
var a = 123; // 123 --> '123'
a = a.toString(); // 调用a的toString()来将其转换为字符串
// a = NaN;
// a = undefined; // 'undefined'
// a = true; // 'true'
// a = null;
// console.log(a, typeof a);
// a = a.toString();
// console.log(a, typeof a);
var b = false; // 'false'
b = null; // "null"
b = undefined; // "undefined"
console.log(b, typeof b);
//调用String()函数来将b转换为字符串
b = String(b);
console.log(b, typeof b);
其他的数据类型,转换为数值(Number)
方式一:使用Number()函数来将其他类型转换为数字
- 转换的情况:
string -> number
- 如果字符串是一个合法的数字,则直接转换为对应的数字
'123' --> 123
'123.45' --> 123.45
- 如果字符串是一个非法的数字,则会转换为NaN
'abc' --> NaN
'123.45.46' --> NaN
'100px' --> NaN
- 空串和纯空格组成的字符串,会转换为0
“ '' --> 0
' ' --> 0
boolean -> number
true --> 1
false --> 0
在JS底层,true就是用1来表示的,false就是用0来表示的
null -> number
null --> 0
undefined -> number
undefined --> NaN
var a = '123'; //123
a = 'abc';
a = '123.45';
a = '123.45.46';
a = '100px';
a = ''; // 空串
a = ' ';
a = 'Infinity'; // Infinity
a = true; //1
a = false; //0
a = null; // 0
a = undefined; // NaN
console.log(a, typeof a);
a = Number(a);
console.log(a, typeof a);
方式二:JS专门为我们提供了两个函数,用来将字符串转换为数字
parseInt()
- 将一个字符串转换为一个整数
paresFloat()
- 将一个字符串转换为一个浮点数
- 原理:
- 使用parseXxx()转换一个字符串时,
它们会自左向右依次读取字符串中的内容,
会把字符串中的合法数字提取出来,然后将其转换为数值
parseInt() 只获取合法的整数位
parseFloat() 获取合法的小数位
var a = '10px';
a = '100px12312423445';
a = '123.456.678';
console.log(a, typeof a);// '123.456.678’ string
// a = parseInt(a);
a = parseFloat(a);
console.log(a, typeof a);//123.456 number
方式三使用>>>转换:
let a = '1';
a = a >>> 0
console.log(a, typeof a); // 1 number
在 JavaScript 中,
>>> 是无符号右移运算符,它可以将运算符左边的数字向右移动运算符右边的数字位数,并使用 0 填充左侧空余的位数。无符号右移运算符会把操作数看作是无符号数,因此不管操作数的符号,移动后在最高位补上的都是 0。
当对一个字符串使用无符号右移运算符时,JavaScript 引擎首先将该字符串(如 ‘1’)转换为对应的数字(如 1),然后执行无符号右移位运算。这里的转换涉及到了类型转换。在上述代码中,a = a >>> 0 实际上就是将字符串 ‘1’ 转换为数字 1,再执行 1 >>> 0 操作,返回结果还是 1。
需要注意的是,位运算符在 JavaScript 中有符号和无符号之分,有些位运算符在没有必要时会先将操作数转换为数字类型再进行运算,因此需要谨慎使用。
将其他的数据类型转换为布尔值:
方式一: - 使用Boolean()函数
转换的情况:
- 数值:
除了0和NaN,其他值都会转换为true
- 字符串:
除了空串,其他值都会转换为true
- null和undefined和NaN都会转换为false
- 大部分对象都会转换为true
var a = 100; // true
a = -100; // true
a = Infinity; // true
a = NaN; // false
a = 0; // false
a = 'hello'; // true
a = 'false'; // true
a = ''; // false
a = ' '; // true
a = null; // false
a = undefined; // false
console.log(a, typeof a);
a = Boolean(a);
console.log(a, typeof a);
欢迎关注我的原创文章:小伙伴们!我是一名热衷于前端开发的作者,致力于分享我的知识和经验,帮助其他学习前端的小伙伴们。在我的文章中,你将会找到大量关于前端开发的精彩内容。
学习前端技术是现代互联网时代中非常重要的一项技能。无论你是想成为一名专业的前端工程师,还是仅仅对前端开发感兴趣,我的文章将能为你提供宝贵的指导和知识。
在我的文章中,你将会学到如何使用HTML、CSS和JavaScript创建精美的网页。我将深入讲解每个语言的基础知识,并提供一些实用技巧和最佳实践。无论你是初学者还是有一定经验的开发者,我的文章都能够满足你的学习需求。
此外,我还会分享一些关于前端开发的最新动态和行业趋势。互联网技术在不断发展,新的框架和工具层出不穷。通过我的文章,你将会了解到最新的前端技术趋势,并了解如何应对这些变化。
我深知学习前端不易,因此我将尽力以简洁明了的方式解释复杂的概念,并提供一些易于理解的实例和案例。我希望我的文章能够帮助你更快地理解前端开发,并提升你的技能。
如果你想了解更多关于前端开发的内容,不妨关注我的原创文章。我会不定期更新,为你带来最新的前端技术和知识。感谢你的关注和支持,我们一起探讨交流技术共同进步,期待与你一同探索前端开发的奇妙世界!
猜你喜欢
- 2024-11-01 Airbnb 开源力作:自动将 JavaScript 代码转换为 TypeScript
- 2024-11-01 JavaScript类型在什么情况下会发生类型自动转换
- 2024-11-01 js如何将接口get参数串转换成post格式输出
- 2024-11-01 【JS 字符转换】fromCharCode和charCodeAt
- 2024-11-01 几个JS开发小技巧,转换(js 开发)
- 2024-11-01 JavaScript将unicode编码转换为中文
- 2024-11-01 每日一题(js篇)通过js做进制转换(js 10进制转2进制)
- 2024-11-01 JavaScript-类型转换 224(javascript)
- 2024-11-01 基于Javascript编写的开源Markdown和HTML相互转换器——showdown
- 2024-11-01 一文读懂js中的隐式类型转换(js隐式调用)
- 最近发表
- 标签列表
-
- cmd/c (57)
- c++中::是什么意思 (57)
- sqlset (59)
- ps可以打开pdf格式吗 (58)
- phprequire_once (61)
- localstorage.removeitem (74)
- routermode (59)
- vector线程安全吗 (70)
- & (66)
- java (73)
- org.redisson (64)
- log.warn (60)
- cannotinstantiatethetype (62)
- js数组插入 (83)
- resttemplateokhttp (59)
- gormwherein (64)
- linux删除一个文件夹 (65)
- mac安装java (72)
- reader.onload (61)
- outofmemoryerror是什么意思 (64)
- flask文件上传 (63)
- eacces (67)
- 查看mysql是否启动 (70)
- java是值传递还是引用传递 (58)
- 无效的列索引 (74)