JavaScript中的包装类型详解
JavaScript中的包装类型详解
- 在 JavaScript 中,我们有基本类型和对象类型两种数据类型。
- 基本类型包括
String,Number,Boolean,null,undefined和Symbol。然而,当我们需要在这些基本类型上调用方法时,就需要用到 JavaScript 的包装类型。
什么是包装类型?
包装类型是 JavaScript 中的一种特殊对象,它们将基本类型的值“包装”在对象中,使我们能够在基本类型上调用方法。JavaScript 提供了三种包装类型:
String,Number和Boolean。例如,当我们在一个字符串上调用方法时,JavaScript 会临时将其转换(或者说“包装”)为一个对象,这样就可以调用方法了。
var str = 'hello';
console.log(str.toUpperCase()); // 输出 "HELLO"
- 在这个例子中,
str是一个字符串基本类型,但我们可以在它上面调用toUpperCase方法。这是因为 JavaScript 在后台临时将str包装成了一个String对象,然后在这个对象上调用了toUpperCase方法。
包装类型的特性
值得注意的是,这种包装只是临时的,调用方法后,基本类型值会恢复到原来的状态。这就是所谓的包装类型。
此外,虽然
null和undefined也是基本类型,但它们没有对应的包装类型,也没有可以调用的方法。
包装类型的注意事项
- 虽然包装类型在 JavaScript 中非常有用,但在使用时也需要注意一些问题。例如,虽然
Boolean对象是一个包装类型,但它在布尔上下文中总是被视为true,无论它包装的值是true还是false。这可能会导致一些意想不到的结果。
var bool = new Boolean(false);
if (bool) {
console.log('run?'); // 会进到 if 条件里面吗?
}
在这个例子中,
bool是一个Boolean对象,其包装的值为false。然而,因为bool是一个对象,所以在if语句中,它被视为true,所以console.log语句总是会执行。所以打印出run?。总的来说,包装类型是 JavaScript 中一个重要的概念,它让我们能够在基本类型上调用方法,极大地增强了 JavaScript 的灵活性和功能性。然而,在使用时,我们也需要注意它的一些特性和潜在问题。
面试题
- 有可能会是面试题,先看以下代码:
var a = new Boolean(false);
if (!a) {
console.log('run?'); // 会进到 if 条件里面吗?
}
- 看了上面关于包装类型的介绍,那会执行到 if 里面吗?
- 不会
- 为什么呢?
// 个人的解析过程:
1. var a = new Boolean(false); 之后,a 的值为 [Boolean: false]
2. 将 a 转换为包装类型,执行 Object(a) 后值为 [Boolean: false]
3. 因为在 if 语句中的判断条件都会转换为 boolean 再进行判断,那再进行 boolean 值的转换, !!Object(a) 后值为 true
4. 而在 if 语句中的条件是取反 a,则 if 条件不成立,则 if 中的语句不执行
- 原因:
- 在 JavaScript 中,有两种类型的布尔值:基本类型的布尔值
(true 或 false)和Boolean对象(通过new Boolean()创建的,它是一个包装对象,可以包装一个布尔值,但它本身是一个对象)。 - 在 JavaScript 中,所有的对象(包括
Boolean对象)在布尔上下文中都被视为true,无论它们包装的值是true还是false。 - 这就是为什么 if 语句中的
!a不会执行的原因,因为a是一个Boolean对象,即使它包装的值是false,在布尔上下文中也被视为true,所以!a的结果是false。
JavaScript中的包装类型详解的更多相关文章
- JavaScript中的Array类型详解
与其他语言中的数组的区别: 1.JavaScript数组的每一项都可以保存任何类型的数据,一个数组的数组元素可以是不同类型的数据. 2.数组的大小是动态调整的,可以随着数据的添加自动的增长. 1.两种 ...
- JavaScript中的对象类型详解
To be finished 摘要 1.什么是对象? 2.引用类型和原始类型 3.对象数据属性拥有的特性(Attributes) 4.如何创建对象 a.直接定义 var mango={color:&q ...
- javascript中=、==、===区别详解
javascript中=.==.===区别详解今天在项目开发过中发现在一个小问题.在判断n==""结果当n=0时 n==""结果也返回了true.虽然是个小问题 ...
- JavaScript中return的用法详解
JavaScript中return的用法详解 最近,跟身边学前端的朋友了解,有很多人对函数中的this的用法和指向问题比较模糊,这里写一篇博客跟大家一起探讨一下this的用法和指向性问题. 1定义 t ...
- javascript 中合并排序算法 详解
javascript 中合并排序算法 详解 我会通过程序的执行过程来给大家合并排序是如何排序的... 合并排序代码如下: <script type="text/javascript& ...
- javascript中的this作用域详解
javascript中的this作用域详解 Javascript中this的指向一直是困扰我很久的问题,在使用中出错的机率也非常大.在面向对象语言中,它代表了当前对象的一个引用,而在js中却经常让我觉 ...
- JavaScript中this的用法详解
JavaScript中this的用法详解 最近,跟身边学前端的朋友了解,有很多人对函数中的this的用法和指向问题比较模糊,这里写一篇博客跟大家一起探讨一下this的用法和指向性问题. 1定义 thi ...
- JavaScript中数组Array方法详解
ECMAScript 3在Array.prototype中定义了一些很有用的操作数组的函数,这意味着这些函数作为任何数组的方法都是可用的. 1.Array.join()方法 Array.join()方 ...
- JavaScript中的注释问题详解? 部分3
注释:解释代码的含义,浏览器中不执行. 方便其他程序员了解代码 ,也可以注释自己不需要的代码(开发过程中)! 1. 单行注释 // 用于一行代码上面 2.多行注释 /* */ 用于一段代码上面 或者是 ...
- JavaScript中的async/await详解
1.前言 async函数,也就是我们常说的async/await,是在ES2017(ES8)引入的新特性,主要目的是为了简化使用基于Promise的API时所需的语法.async和await关键字 ...
随机推荐
- 2.SpringBoot快速上手
2.SpringBoot快速上手 SpringBoot介绍 javaEE的开发经常会涉及到3个框架Spring ,SpringMVC,MyBatis.但是这三个框架配置极其繁琐,有大量的xml文件,s ...
- Unicode 和JS中的字符串
计算机内部使用二进制存储数据,只认识0和1两个数字,计算机的世界只有0和1.但我们的世界却充满着文字,如a, b, c.怎样才能让计算机显示文字,供我们使用和交流?只能先把文字转化成数字进行存储,然后 ...
- Java(screw)生成数据库表结构
数据库支持 MySQL MariaDB TIDB Oracle SqlServer PostgreSQL Cache DB(2016) 文档生成支持 html word markdown 方式一:代码 ...
- Mac mysql 5.7.x 设置服务开机自启动
在终端输入 sudo vi /Library/LaunchDaemons/com.mysql.mysql.plist 输入以下内容 <?xml version="1.0" e ...
- Java FastJson解析json字符串
json转map Map<String, 实体类> titleMap=JSON.parseObject(JSON字符串, new TypeReference<HashMap<S ...
- opc ua设备数据 转MQTT项目案例
目录 1 案例说明 1 2 VFBOX网关工作原理 1 3 准备工作 2 4 配置VFBOX网关采集OPC UA的数据 2 5 用MQTT协议转发数据 4 6 配置参数说明 4 7 上报内容配置 5 ...
- FFmpeg开发笔记(三十八)APP如何访问SRS推流的RTMP直播地址
<FFmpeg开发实战:从零基础到短视频上线>一书在第10章介绍了轻量级流媒体服务器MediaMTX,通过该工具可以测试RTSP/RTMP等流媒体协议的推拉流.不过MediaMTX的功能 ...
- AI驱动音乐创新,网易数帆X云音乐刷新MIREX世界纪录 网易数帆 网易数帆
在近期揭榜的2021国际音频检索评测大赛(MIREX)上,网易数帆易智语音团队携手网易云音乐音视频实验室,凭借生产级AI技术创新能力,在歌词识别和歌单识别两个赛道大幅打破世界纪录夺得冠军. MIREX ...
- C# ClassHelper动态创建程序集和类, 添加/删除类属性
using System; using System.Collections.Generic; using System.Reflection; using System.Reflection.Emi ...
- 关于IE11点击的select框需要点击两次才能展开option选择框
需求:select是一个级联选择框,点击select框之后向后台请求,然后把请求的数据展示出来. 问题:绑定onclick或者onfocus的时候,需要点击select框两次,才能将option选择框 ...