八个针对高级职位的高级 JavaScript 面试题( 三 )

值得探索的一个有趣的方面是 JavaScript 如何处理对象到原始值(例如字符串、数字或布尔值)的转换 。这是一个有趣的问题 , 测试您是否知道强制转换如何与对象一起使用 。
在字符串连接或算术运算等场景中处理对象时 , 这种转换至关重要 。为了实现这一点 , JavaScript 依赖于两个特殊的方法:valueOf 和 toString 。
valueOf 方法是 JavaScript 对象转换机制的基本部分 。当在需要原始值的上下文中使用对象时 , JavaScript 首先在对象中查找 valueOf 方法 。
如果 valueOf 方法不存在或未返回适当的原始值 , JavaScript 将回退到 toString 方法 。该方法负责提供对象的字符串表示形式 。
回到我们原来的代码片段:
const obj = {valueOf: () => 42,toString: () => 27};console.log(obj + '');当我们运行此代码时 , 对象 obj 被转换为原始值 。在本例中 , valueOf 方法返回 42 , 然后 , 由于与空字符串连接而隐式转换为字符串 。因此 , 代码的输出将为 42 。
但是 , 如果 valueOf 方法不存在或未返回适当的原始值 , JavaScript 将回退到 toString 方法 。让我们修改一下之前的例子:
const obj = {toString: () => 27};console.log(obj + '');这里 , 我们删除了 valueOf 方法 , 只留下 toString 方法 , 该方法返回数字 27 。在这种情况下 , JavaScript 将诉诸 toString 方法进行对象转换 。
6、理解对象键在 JavaScript 中使用对象时 , 了解如何在其他对象的上下文中处理和分配键非常重要 。考虑以下代码片段并花一些时间猜测输出:
let a = {};let b = { key: 'test' };let c = { key: 'test' };a[b] = '123';a[c] = '456';console.log(a);乍一看 , 这段代码似乎应该生成一个具有两个不同键值对的对象 a 。然而 , 由于 JavaScript 对对象键的处理方式 , 结果完全不同 。
JavaScript 使用默认的 toString() 方法将对象键转换为字符串 。但为什么?在 JavaScript 中 , 对象键始终是字符串(或符号) , 或者它们通过隐式强制转换自动转换为字符串 。当您使用字符串以外的任何值(例如数字、对象或符号)作为对象中的键时 , JavaScript 会在将该值用作键之前在内部将该值转换为其字符串表示形式 。
因此 , 当我们使用对象 b 和 c 作为对象 a 中的键时 , 两者都会转换为相同的字符串表示形式:[object Object] 。由于这种行为 , 第二个赋值 a[b] = '123'; 将覆盖第一个赋值 a[c] = '456'; 。
现在 , 让我们逐步分解代码:

  • let a = {};:初始化一个空对象a 。
  • let b = { key: 'test' };: 创建一个对象 b , 其属性键值为 'test' 。
  • let c = { key: 'test' };: 定义另一个与 b 结构相同的对象 c 。
  • a[b] = '123';:将对象a中键为[object Object]的属性设置为值'123' 。
a[c] = '456';:将对象 a 中键 [object Object] 相同属性的值更新为 '456' , 替换之前的值 。两个分配都使用相同的键字符串 [object Object] 。结果 , 第二个赋值会覆盖第一个赋值设置的值 。
当我们记录对象 a 时 , 我们观察到以下输出:
{ '[object Object]': '456' }7、==运算符console.log([] == ![]);这个有点复杂 。那么 , 您认为输出会是什么?让我们逐步评估一下 。让我们首先看看两个操作数的类型:
typeof([]) // "object"typeof(![]) // "boolean"对于[]来说它是一个对象 , 这是可以理解的 。JavaScript 中的一切都是对象 , 包括数组和函数 。但是操作数![]如何具有布尔类型呢?让我们试着理解这一点 。当你使用 ! 对于原始值 , 会发生以下转换:
假值:如果原始值是假值(例如 false、0、null、undefined、NaN 或空字符串 '') , 则应用 ! 会将其转换为 true 。
真值:如果原始值是真值(任何非假值) , 则应用!会将其转换为 false 。
在我们的例子中 , [] 是一个空数组 , 它是 JavaScript 中的真值 。由于 [] 为真 , 所以 ![] 变为假 。所以 , 我们的表达式就变成了:


推荐阅读