コミュニティ 学ぶ ツールライブラリ レジャー
検索
日本語
ホームページ > ウェブフロントエンド > フロントエンドQ&A > 本文

JavaScript 演算子は何に分類できるか

青灯夜游
リリース： 2021-10-15 16:44:53
オリジナル
4526 人が閲覧しました

JavaScript 演算子は次のように分類できます: 1. 一般的な数学演算を実行するために使用される算術演算子; 2. 変数に値を割り当てるために使用される代入演算子; 3. 文字列演算子; 4. 自動インクリメントデクリメント演算子、5. 比較演算子、6. 論理演算子、7. 三項演算子、8. ビット演算子。

JavaScript 演算子は何に分類できるか

このチュートリアルの動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。

算術演算子

算術演算子は、加算、減算、乗算、除算などの一般的な数学演算を実行するために使用されます。以下の表に示されています。JavaScript でサポートされている算術演算子は、次のとおりです。

##x - y は、x から y を引いた差を計算することを意味します##乗算演算子/%サンプルコードは次のとおりです。
演算子 説明 例
加算演算子 xx y は、x に y を加えた合計を計算することを意味します
- 減算演算子
##x * y は、x と y の積を計算します。
除算演算子 x / y は、x を y で割った商を計算します。
モジュロ (剰余) 演算子 x % y は、x を y で割った剰余を計算することを意味します 


复制纯文本复制
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
var x = 10, y = 4;
console.log("x + y =", x + y);  // 输出：x + y = 14
console.log("x - y =", x - y);  // 输出：x - y = 6
console.log("x * y =", x * y);  // 输出：x * y = 40
console.log("x / y =", x / y);  // 输出：x / y = 2.5
console.log("x % y =", x % y);  // 输出：x % y = 2
ログイン後にコピー
ログイン後にコピー
上記のコードの内容は、二重引用符内は文字列であるため、演算子はそのまま出力され、演算には関与しません。


代入演算子代入演算子は、値を変数に代入するために使用されます。次の表は、サポートされている代入演算の一覧です。シンボル:


##演算子説明例= 最も単純な代入演算子。演算子の右側の値を演算子の左側の変数に代入します。xx = 10 は、変数 x を 10 =最初に加算演算を実行し、その結果を演算子の左側の変数に代入します#x = y は x と同等です= x y-=最初に減算を実行し、その結果を演算子の左側の変数に代入します。x -= y は x = x - y と同等です*=最初に乗算を実行し、次に結果を演算子の左側の変数に代入しますx *= y は x = x * y## と同等です 最初に除算演算を実行してから、結果を変数に代入します演算子の左側 最初にモジュロ演算を実行しますそして、その結果を演算子の左側の変数に代入します。 と同等です。サンプル コードは次のとおりです。
に代入することを意味します。
#/=
#x /= y は x = x / y と同等です%=
x %= y は x = x % y

##

复制纯文本复制
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

var x = 10;
x += 20;
console.log(x);  // 输出：30
var x = 12,
    y = 7;
x -= y;
console.log(x);  // 输出：5
x = 5;
x *= 25;
console.log(x);  // 输出：125
x = 50;
x /= 10;
console.log(x);  // 输出：5
x = 100;
x %= 15;
console.log(x);  // 输出：10
ログイン後にコピー
ログイン後にコピー

文字列演算子

JavaScript の および =

演算子は、 に加えて数学演算を実行でき、文字列の結合にも使用できます。


演算子は、演算子の左側と右側の文字列を結合することを意味します。

  • = 演算子は、最初に文字列を連結し、次に結果を代入することを意味します演算子の左側の変数に代入します。
  • サンプル コードは次のとおりです。 

复制纯文本复制
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

var x = "Hello ";
var y = "World!";
var z = x + y;
console.log(z);  // 输出：Hello World!
x += y;
console.log(x);  // 输出：Hello World!
ログイン後にコピー
ログイン後にコピー

自動インクリメント演算子と自動デクリメント演算子は、値に対して自動インクリメント (1) および自動デクリメント (-1) 演算を実行するために使用されます。変数の値を次の表に示します。JavaScript でサポートされるインクリメント演算子とデクリメント演算子:

Operator

Name影響x を 1 ずつインクリメントし、xxx の値を返します。 x インクリメント演算子xの値を返し、x--xデクリメント演算子##に1を加算します。 #x の値を返します--デクリメント演算子x の値を返します。次に、x を 1 だけ減らします。

示例代码如下：

var x;
x = 10;
console.log(++x);  // 输出：11
console.log(x);    // 输出：11
x = 10;
console.log(x++);  // 输出：10
console.log(x);    // 输出：11
x = 10;
console.log(--x);  // 输出：9
console.log(x);    // 输出：9
x = 10;
console.log(x--);  // 输出：10
console.log(x);    // 输出：9
ログイン後にコピー
ログイン後にコピー

比较运算符

比较运算符用来比较运算符左右两侧的表达式，比较运算符的运算结果是一个布尔值，结果只有两种，不是 true 就是 false。下表中列举了 JavaScript 中支持的比较运算符：

xインクリメント演算子
#x を 1 減算し、xx
运算符名称示例
==等于x == y 表示如果 x 等于 y，则为真
===全等x === y 表示如果 x 等于 y，并且 x 和 y 的类型也相同，则为真
!=不相等x != y 表示如果 x 不等于 y，则为真
!==不全等x !== y 表示如果 x 不等于 y，或者 x 和 y 的类型不同，则为真
<小于x < y 表示如果 x 小于 y，则为真
>大于x > y 表示如果 x 大于 y，则为真
>=大于或等于x >= y 表示如果 x 大于或等于 y，则为真
<=小于或等于x <= y 表示如果 x 小于或等于 y，则为真

示例代码如下：

var x = 25;
var y = 35;
var z = "25";
console.log(x == z);  // 输出： true
console.log(x === z); // 输出： false
console.log(x != y);  // 输出： true
console.log(x !== z); // 输出： true
console.log(x < y);   // 输出： true
console.log(x > y);   // 输出： false
console.log(x <= y);  // 输出： true
console.log(x >= y);  // 输出： false
ログイン後にコピー
ログイン後にコピー

逻辑运算符

逻辑运算符通常用来组合多个表达式，逻辑运算符的运算结果是一个布尔值，只能有两种结果，不是 true 就是 false。下表中列举了 JavaScript 中支持的逻辑运算符：

运算符名称示例
&&逻辑与x && y 表示如果 x 和 y 都为真，则为真
||逻辑或x || y 表示如果 x 或 y 有一个为真，则为真
!逻辑非!x 表示如果 x 不为真，则为真

示例代码如下：

var year = 2021;
// 闰年可以被 400 整除，也可以被 4 整除，但不能被 100 整除
if((year % 400 == 0) || ((year % 100 != 0) && (year % 4 == 0))){
    console.log(year + " 年是闰年。");
} else{
    console.log(year + " 年是平年。");
}
ログイン後にコピー
ログイン後にコピー

三元运算符

三元运算符（也被称为条件运算符），由一个问号和一个冒号组成，语法格式如下：

条件表达式 ? 表达式1 : 表达式2 ;

如果“条件表达式”的结果为真（true），则执行“表达式1”中的代码，否则就执行“表达式2”中的代码。

示例代码如下：

var x = 11,
    y = 20;
x > y ? console.log("x 大于 y") : console.log("x 小于 y");  // 输出：x 小于 y
ログイン後にコピー
ログイン後にコピー

位运算符

位运算符用来对二进制位进行操作，JavaScript 中支持的位运算符如下表所示：

运算符描述示例
&按位与：如果对应的二进制位都为 1，则该二进制位为 15 & 1 等同于 0101 & 0001 结果为 0001，十进制结果为 1
|按位或：如果对应的二进制位有一个为 1，则该二进制位为 15 | 1 等同于 0101 | 0001 结果为 0101，十进制结果为 5
^按位异或：如果对应的二进制位只有一个为 1，则该二进制位为 15 ^ 1 等同于 0101 ^ 0001 结果为 0100，十进制结果为 4
~按位非：反转所有二进制位，即 1 转换为 0，0 转换为 1~5 等同于 ~0101 结果为 1010，十进制结果为 -6
<<按位左移：将所有二进制位统一向左移动指定的位数，并在最右侧补 05 << 1 等同于 0101 << 1 结果为 1010，十进制结果为 10
>>按位右移（有符号右移）：将所有二进制位统一向右移动指定的位数，并拷贝最左侧的位来填充左侧5 >> 1 等同于 0101 >> 1 结果为 0010，十进制结果为 2
>>>按位右移零（无符号右移）：将所有二进制位统一向右移动指定的位数，并在最左侧补 05 >>> 1 等同于 0101 >>> 1 结果为 0010，十进制结果为 2

示例代码如下：

var a = 5 & 1,
    b = 5 | 1,
    c = 5 ^ 1,
    d = ~ 5,
    e = 5 << 1,
    f = 5 >> 1,
    g = 5 >>> 1;
console.log(a);  // 输出：1
console.log(b);  // 输出：5
console.log(c);  // 输出：4
console.log(d);  // 输出：-6
console.log(e);  // 输出：10
console.log(f);  // 输出：2
console.log(g);  // 输出：2
ログイン後にコピー
ログイン後にコピー

【推荐学习：javascript高级教程】

以上がJavaScript 演算子は何に分類できるかの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル：
javascript オペレーター
ソース：php.cn
前の記事：反応とJavaScriptの違いは何ですか? 次の記事：Maxthon 3 で JavaScript を有効にする方法
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
JavaScript を使用せずにクリック時に画像ソースを動的に変更する CSS のみのメソッド img:active{} のような CSS のみを使用して、マウスクリック時に画像の src を変更する必要があります
から 2024-04-06 19:25:49
0
1
505
d3.js でズームインすると散布図のポイントの値が維持されない d3.js を使用するのは初めてなので、ご容赦ください。 vue.js ファイルに純粋な JavaScript として実装しました。ズーム機能を使用して散布図を作成しようとしていま...
から 2024-04-06 18:16:26
0
1
403
ベンダー固有の疑似要素上の JavaScript ホバー イベント 次の htmlinput タグがあります。 $("input[type='range']::-webkit-slider-thumb").on('hover',...
から 2024-04-06 15:35:24
0
1
274
Javascript/Jqueryを使用してボタンなしでフォームを送信する JavaScript 関数を呼び出し、JQUERY/PHP を使用してフォームを実行することにより、ボタンのないフォームを送信しようとしています。ページを再読み込みせずに、バックエ...
から 2024-04-06 14:54:03
0
2
421
CollapseDisplay クラスを使用してブートストラップ アコーディオン ヘッダーの外観をカスタマイズする class Collapseshow を使用してパネルのカード タイトルのスタイルを設定したいと考えています。この例では、最初のパネルです。 CSS を使用して .accordio...
から 2024-04-06 12:53:11
0
1
376
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート