⭐️ 交互式 JavaScript 测验 #1

我们都知道 JavaScript 测验可能...非常糟糕且令人困惑😐毫无意义的foo bar baz问题破坏了 JavaScript 的所有乐趣，并且常常只会引起更多的困惑！

去年，我创建了一个 GitHub 仓库，里面有很多 JavaScript 问题，它们并非“棘手”之类的问题"NaN === NaN"，而是侧重于更现实的情况。我觉得在 Dev.to 上把它们做成一个互动游戏系列会很有趣，尽可能地配上动画解释！🥳

lydiahallie / javascript 问题

一长串（高级）JavaScript 问题及其解释✨

当然，这些示例仍然很简陋，并没有展示“最佳/最高效的做法”。有时我必须以某种方式去做，才能展示可能发生的某些行为，并以此方式进行解释 🙂

1. 输出是什么？

解释

使用bind()andcall()方法，我们可以决定关键字应该引用哪个对象this。在这个例子中，我们通过在函数上同时调用and来表示函数this中的关键字sayHi应该引用该对象。personbindcallsayHi

尽管bind()和call()方法都允许我们指定this关键字应该引用哪个对象，但还是存在细微的差别：

• bind()仅返回绑定函数的副本
• call()立即执行绑定函数

首先，我们记录sayHi.call(person, 21)。该call方法立即执行（绑定的）函数，结果为Lydia is 21。

然后，我们记录sayHi.bind(person, 21)。该bind方法返回绑定函数的副本，这意味着我们只是记录了一个新的、复制的函数😃

2. 输出是什么？

解释

每当我们声明一个等于某个对象的变量集合时，我们实际上并没有赋予该变量该对象的值。相反，我们赋予的是该对象在内存中的引用（或者实际上是指针）的值！⚡️

在这种情况下，我们赋予变量内存中person对象的引用（指针）的值。{ name: "Lydia" }

然后，我们声明一个名为的变量members。的值members是内存中该数组的引用！

数组中第一个members被引用的元素，就是person被引用的对象。当我们将对象设置为相等时，实际上是在创建引用的副本。这意味着现在数组person中的第一个元素和members引用指向的是内存中的同一个对象！😃

然后，我们将 设置person为等于null。这意味着不再具有内存中对象person的引用值：它现在具有对 的引用！🎉 由于数组中第一个引用 的元素拥有其自己的复制引用，因此 的值的更改不会影响该数组中的第一个元素！{ name: "Lydia" }nullmembersperson

由于数组中的第一个元素members仍然具有对该对象的引用{ name: "Lydia" }，因此在记录第一个元素时将返回该对象！

3. 输出是什么？

解释

我们有一份购物清单！清单里有一件是我们最喜欢的，还有一件是我们最不喜欢的。

首先，我们要获取我们最喜欢的物品——葡萄的价值！一种方法是使用find()方法。该find方法返回数组中我们要查找的项的值：在本例中是包含葡萄的字符串。我们将返回的值"🍇"赋给变量。favoriteItem

由于字符串"🍇"是原始数据类型（它就是一个字符串！🥳），因此它通过值传递。这意味着 的值是数组中favoriteItem元素的副本，不包含对数组的任何引用。"🍇"groceriesgroceries

我们不再想把葡萄当成最爱！相反，我们想把牛油果"🥑"当成最爱。变量favoriteItem被重新赋值为"🥑"。

然后，我们要找到我们最不喜欢的食物的索引：包含奶酪的字符串"🧀"！为了找到奶酪的索引，我们可以使用indexOf方法。在本例中，我们将要获取其在数组indexOf中的索引的元素的值传递给该方法。groceries"🧀"

完美！现在我们得到了最不喜欢的物品的索引。是时候用一些好吃的披萨来替换它了"🍕"。通过替换特定索引上物品的值，我们修改了groceries数组。

太棒了！我们刚刚修改了 groceries 数组中我们最不喜欢的商品。记录groceries数组时，["🍅", "🍇", "🍕"]结果返回了。

怎么样？你三道题都答对了吗？如果答对了，太棒了！🎉 如果你犯了错误，不用担心！

希望您能从这些解释中学到一些东西，并在下次遇到看似“出乎意料”的行为时考虑到这些新信息。

请随时与我联系！