乐趣区

关于前端:JavaScript中的包装类型详解

JavaScript 中的包装类型详解

  • 在 JavaScript 中,咱们有根本类型和对象类型两种数据类型。
  • 根本类型包含 StringNumberBooleannullundefinedSymbol。然而,当咱们须要在这些根本类型上调用办法时,就须要用到 JavaScript 的包装类型。

什么是包装类型?

  • 包装类型是 JavaScript 中的一种非凡对象,它们将根本类型的值“包装”在对象中,使咱们可能在根本类型上调用办法。JavaScript 提供了三种包装类型:StringNumberBoolean
  • 例如,当咱们在一个字符串上调用办法时,JavaScript 会长期将其转换(或者说“包装”)为一个对象,这样就能够调用办法了。
var str = 'hello';
console.log(str.toUpperCase()); // 输入 "HELLO"
  • 在这个例子中,str 是一个字符串根本类型,但咱们能够在它下面调用 toUpperCase 办法。这是因为 JavaScript 在后盾长期将 str 包装成了一个 String 对象,而后在这个对象上调用了 toUpperCase 办法。

包装类型的个性

  • 值得注意的是,这种包装只是长期的,调用办法后,根本类型值会复原到原来的状态。这就是所谓的包装类型。
  • 此外,尽管 nullundefined 也是根本类型,但它们没有对应的包装类型,也没有能够调用的办法。

包装类型的注意事项

  • 尽管包装类型在 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 中的语句不执行
  • 起因:

    1. 在 JavaScript 中,有两种类型的布尔值:根本类型的布尔值 (true 或 false)Boolean 对象(通过 new Boolean() 创立的,它是一个包装对象,能够包装一个布尔值,但它自身是一个对象)。
    2. 在 JavaScript 中,所有的对象(包含 Boolean 对象)在布尔上下文中都被视为 true,无论它们包装的值是 true 还是 false
    3. 这就是为什么 if 语句中的 !a 不会执行的起因,因为 a 是一个 Boolean 对象,即便它包装的值是 false,在布尔上下文中也被视为 true,所以 !a 的后果是 false
退出移动版