「!」←これ(びっくりマーク、エクスクラメーションマーク)は何？〜論理否定演算子〜

javascriptに使われる「!」について。

jQueryを超簡単に扱える程度なのですが、Vue.jsの学習をしていたところshow = !showという表記が出てきてハテナ状態になってしまったので「!」についての記事です。

「!」は論理演算子と呼ばれるもののひとつのようです。

他には「&&(and)」や「||(or)」があります。

if文と一緒によく使われるふたつですね。

それぞれ「論理積演算子」、「論理和演算子」と呼ぶそうです。

「!」(論理否定演算子)

「!」はビックリマークなどの呼び方でよさそう。

以下公式リファレンスより。

単一の演算対象が true と見ることができる場合は、false を返します。そうでない場合は、true を返します。

なるほど？

私が見たvueのコードの場合では以下のように使われていました。

(vur.js公式より)

<button v-on:click="show = !show">
Toggle
</button>

new Vue({
el: '#demo',
data: {
show: true
}
})

showをtrueと定義しています。

つまり、ボタンがクリックされたらshow(true)に!show(false)を返すことになります。

詳細はJavascriptのリファレンスにて！