javascript - 这个功能具体是如何工作的？

Question

谁能解释一下这个函数是如何工作的？我知道三元运算符，所以我理解他检查标志是否为 true 的部分，如果不是，则使用 2. 值。但我不明白为什么 flag 首先是一个 bool 值，以及为什么当 时它从 true 切换到 false ，反之亦然>animate() 正在被调用...

flag = $texte.data('animToggle');
$texte.data('animToggle', !flag);
$texte.animate({
    'left': flag ? '-51%' : '0'
})

Answer 1

JavaScript 有 truthy and falsy values .当评估为 bool 值时，这些值等于 true 和 false。这意味着 true 和 false 不是唯一可以表示 true 或 false 数据的值。

例如，如果 $texte.data('animToggle') 等于 0，则 falsy 为 0 是一个假值。

示例 1:1000

1000 是一个 truthy 值，所以这将输出“True”:

var flag = 1000;
console.log(flag ? "True" : "False");

> "True"

示例 2:""

""(空字符串)是一个 falsy 值，所以这将输出“False”:

var flag = "";
console.log(flag ? "True" : "False");

> "False"

---

! (Logical NOT) operator将值转换为 bool 值并取反。 $texte.data('animToggle', !flag); 将 $texte 的 animToggle 数据属性设置为与之前相反的值.

!true   // False
!1000   // False

!false  // True
!""     // True