JavaScript逻辑或操作员在函数的返回语句中

发布于 2025-01-24 18:32:11 字数 251 浏览 3 评论 0原文

我正在使用Vuetify，特别是从内部V形式的V-Text-Field。这些V-Text-Field中的每一个都有一个名为“规则”的属性，用于验证。该属性接受具有一堆功能的数组。这是我偶然发现了一个怪异的代码的地方：

(title) => !!title || "Title is required"

因此，想法是，此函数从输入中获取值，如果长度等于0，则错误消息“必需的标题”是显示。我的问题是：此功能实际返回什么？

原文

I am using Vuetify, specifically the v-text-field from inside v-form. Each of these v-text-fields has a property called rules, used for validation. That property accepts an array with a bunch of functions. This is where I've stumbled over a weird-ish piece of code:

(title) => !!title || "Title is required"

So, the idea is that this function gets the value from the input, and if the length is equal to 0, then the error message "Title is required" is shown. My question is: what does this function actually return?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

巴黎夜雨 2025-01-31 18:32:11

(title) => !!title || "Title is required"]

此行说：
如果存在title，返回true，否则返回“标题是必需的”。 H4>

让我们将其分解

为...首先，箭头功能只是：

function xxxx (title) {
  return !!title || "Title is required"];
}

接下来，!!是双重否定的，实际上只是逻辑上不是opperator 两次。第一个否定将数据（无论是数据类型）转换为布尔值。第二个否定再次改变了布尔值，以给出所需的结果。

例如!!'Hello' - ＆gt; true，!! 0 - ＆gt; false，!! UNDEFINED - ＆gt; false

下一部分是比较。 ||是或opperator ，因此，如果上半年是True/Prange，则将返回||后的零件，将返回。

例如true || '一些文本'将返回true，wheras false || '一些文本'将返回一些文本

这里有一些示例，尝试运行摘要以查看输出

const checkTitle = (title) => !!title || "Title is required"

// 1. No parameters, should print "Title is required"
console.log('Test 1', checkTitle()); 

// 2. Parameter presentbut empty, should print "Title is required"
console.log('Test 2', checkTitle("")); 

// 3. Title present, and valid, should preint 'true'
console.log('Test 3', checkTitle('Hello World!'));

这不是最好的代码，因为它不太清楚，而且您通常不想混合这样的类型。它还没有检查标题是否是有效的类型，因此123或true将被接受为有效。

(title) => !!title || "Title is required"]

This line is saying:
If title is present, return true, otherwise return "Title is required".

Let's break it down...

To start with, the arrow function is just shorthand for:

function xxxx (title) {
  return !!title || "Title is required"];
}

Next, the !! is a double negation, effectively just the logical not opperator twice. The first negation converts the data (whatever it data type it may be) to a boolean. The second negation changes the boolean again to give the desired result.

E.g. !!'hello' --> true, !!0 --> false, !!undefined --> false

The next part is a comparison. The || is OR opperator, so if the first half is true / present, then it will be returned, if not, the part after the || will be returned.

E.g. true || 'some text' will return true, wheras false || 'some text' will return some text

Here are some example, try running the snippet to see the outputs

const checkTitle = (title) => !!title || "Title is required"

// 1. No parameters, should print "Title is required"
console.log('Test 1', checkTitle()); 

// 2. Parameter presentbut empty, should print "Title is required"
console.log('Test 2', checkTitle("")); 

// 3. Title present, and valid, should preint 'true'
console.log('Test 3', checkTitle('Hello World!'));

It's not the best code, because it's not super clear, and you usually don't want to mix types like this. It also doesn't check if the title is a valid type, so 123 or true would be accepted as valid.

回复收藏 0 原文

~没有更多了~