《JavaScript面向对象精要》——1.8 原始封装类型

简介:

本节书摘来自异步社区《JavaScript面向对象精要》一书中的第1章,第1.8节,作者:【美】Nicholas C. Zakas 译者: 胡世杰 更多章节内容可以访问云栖社区“异步社区”公众号查看。

1.8 原始封装类型

JavaScript中一个最让人困惑的部分可能就是原始封装类型的概念。原始封装类型共有3种(String、Number和Boolean)。这些特殊引用类型的存在使得原始类型用起来和对象一样方便。(如果你不得不用独特的语法或切换为基于过程的编程方式来获取一个子字符串,那就太让人困惑啦)。

当读取字符串、数字或布尔值时,原始封装类型将被自动创建。例如,下列代码第一行,一个原始字符串的值被赋给name。第二行代码把name当成一个对象,使用点号调用了charAt方法。

var name = "Nicholas";
var firstChar = name.charAt(0);
console.log(firstChar);     // "N"

这是在背后发生的事情如下。

// what the JavaScript engine does
var name = "Nicholas";
var temp = new String(name);
var firstChar = temp.charAt(0);
temp = null;
console.log(firstChar);     // "N"

由于第二行把字符串当成对象使用,JavaScript引擎创建了一个字符串的实体让charAt(0)可以工作。字符串对象的存在仅用于该语句并在随后被销毁(一种称为自动打包的过程)。为了测试这一点,试着给字符串添加一个属性看看它是不是对象。

var name = "Nicholas";
name.last = "Zakas";

console.log(name.last);     // undefined

这段代码试图给字符串name添加last属性。代码运行时没有错误,但是属性却消失了。到底发生了什么?你可以在任何时候给一个真的对象添加属性,属性会保留至你手动删除它们。原始封装类型的属性会消失是因为被添加属性的对象立刻就被销毁了。

下面是在JavaScript引擎中实际发生的事情。

// what the JavaScript engine does
var name = "Nicholas";
var temp = new String(name);
temp.last = "Zakas";
temp = null;           // temporary object destroyed

var temp = new String(name);
console.log(temp.last);    // undefined
temp = null;

实际上是在一个立刻就被销毁的临时对象上而不是字符串上添加了新的属性。之后当你试图访问该属性时,另一个不同的临时对象被创建,而新属性并不存在。虽然原始封装类型会被自动创建,在这些值上进行instanceof检查对应类型的返回值却都是false。

var name = "Nicholas";
var count = 10;
var found = false;

console.log(name instanceof String);   // false
console.log(count instanceof Number);   // false
console.log(found instanceof Boolean);  // false

这是因为临时对象仅在值被读取时创建。instanceof操作符并没有真的读取任何东西,也就没有临时对象的创建,于是它告诉我们这些值并不属于原始封装类型。

你也可以手动创建原始封装类型,但有某些副作用。

var name = new String("Nicholas");
var count = new Number(10);
var found = new Boolean(false);

console.log(typeof name);     // "object"
console.log(typeof count);    // "object"
console.log(typeof found);    // "object"

如你所见,手动创建原始封装类型实际会创建出一个object,这意味着typeof无法鉴别出你实际保存的数据的类型。

另外,使用String、Number和Boolean对象和使用原始值有一定区别。例如,下列代码使用了Boolean对象,对象的值是false,但console.log(“Found”)依然会被执行。这是因为一个对象在条件判断语句中总被认为是true,无论该对象的值是不是等于false。

var found = new Boolean(false);
if (found) {
    console.log("Found");              // this executes
}

手工创建的原始封装类型在其他地方也很容易让人误解,在大多数情况下都只会导致错误。所以,除非有特殊情况,你应该避免这么做。

相关文章
|
9天前
|
前端开发 数据安全/隐私保护
crypto-js中AES的加解密封装
文章介绍了如何在前端使用crypto-js库进行AES加密和解密,提供了加解密的函数封装示例,并演示了如何加密和解密字符串或对象。
44 1
crypto-js中AES的加解密封装
|
2月前
|
前端开发 JavaScript 搜索推荐
Next.js 适合什么类型的项目开发?
【8月更文挑战第4天】Next.js 适合什么类型的项目开发?
113 3
|
4月前
|
JavaScript 前端开发
JavaScript中的布尔类型与数字类型详解
JavaScript中的布尔类型与数字类型详解
|
24天前
|
设计模式 JavaScript
JS发布订阅模式封装(纯手工)
发布订阅模式是JS常用的设计模式,在面试中也会经常遇到,以下是我的手写实现方式,经测试效果不错,小伙伴们们可以直接拷贝使用。
|
2月前
|
缓存 JavaScript 前端开发
|
2月前
|
JavaScript 前端开发
在JavaScript如何确认数据的类型?
# `typeof` 与 `instanceof` 数据类型判断 `typeof` 操作符用于确定变量的基本数据类型,例如: - "string" - "number" - "boolean" - "undefined" 但对于引用类型如对象和数组,包括 `null`,它返回 "object"。 `instanceof` 用于检查对象是否为特定构造函数的实例,返回布尔值。它能准确识别数组等复杂类型,通过检查对象的原型链来确定其是否属于某个构造函数的实例。 两者结合使用可全面判断数据类型。
28 2
|
2月前
|
JavaScript 前端开发 UED
探秘 JavaScript 错误背后的真相——揭开异常类型的神秘面纱,让你的代码从此无懈可击!
【8月更文挑战第23天】本文深入探讨了JavaScript中常见的异常类型,包括`ReferenceError`(未定义的引用)、`TypeError`(类型错误)、`SyntaxError`(语法错误)、`RangeError`(范围错误)、`EvalError`(评估错误)以及`URIError`(URI错误),并通过示例展示了如何有效地诊断与处理这些异常。此外,还介绍了如何自定义错误类以适应特定场景的需求。掌握这些异常处理技巧对于构建稳定可靠的Web应用程序至关重要。
31 0
|
2月前
|
JavaScript 前端开发 安全
TypeScript:解锁JavaScript的超级英雄模式!类型系统如何化身守护神,拯救你的代码免于崩溃与混乱,戏剧性变革开发体验!
【8月更文挑战第22天】TypeScript作为JavaScript的超集,引入了强大的类型系统,提升了编程的安全性和效率。本文通过案例展示TypeScript如何增强JavaScript:1) 显式类型声明确保函数参数与返回值的准确性;2) 接口和类加强类型检查,保证对象结构符合预期;3) 泛型编程提高代码复用性和灵活性。这些特性共同推动了前端开发的标准化和规模化。
51 0
|
2月前
|
JavaScript 前端开发
javascript 异常问题之JavaScript中的异常有哪些类型,可以举例说明吗
javascript 异常问题之JavaScript中的异常有哪些类型,可以举例说明吗
|
3月前
|
JavaScript 前端开发 容器
vue组件封装——固定宽高比的容器(2种方法:纯CSS实现 + JS实现)
vue组件封装——固定宽高比的容器(2种方法:纯CSS实现 + JS实现)
109 2
下一篇
无影云桌面