JS 语言基础笔记——第五篇（操作符）

最新推荐文章于 2024-05-12 16:27:03 发布

二师弟_k

最新推荐文章于 2024-05-12 16:27:03 发布

阅读量376

点赞数

分类专栏： JS学习文章标签： js javascript

本文链接：https://blog.youkuaiyun.com/weixin_50936255/article/details/117376463

版权

JS学习专栏收录该内容

22 篇文章

订阅专栏

这篇笔记详细介绍了JavaScript中的各种操作符，包括一元操作符如自加、自减，位操作符如按位非、按位与，布尔操作符，乘法和指数操作符，关系和相等操作符，条件操作符以及赋值和逗号操作符。特别强调了操作符在处理不同类型值时的行为，例如类型转换和短路特性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

前言

本篇笔记主要内容为 js 中的操作符，这些操作符在应用于 Object 时，操作符通常会调用 valueOf() 和/或 toString() 方法来取得可以计算的值。

1、一元操作符

①自加：++；自减：-- 。

对于 String：如果是有效数值型则转变为数值再操作，类型变为 Number ；如果不是有效数值，则将变量设置为 NaN ，类型变为 Number。

对于 Boolean：为 true 则转变为 1 再操作；为 false 则转变为 0 再操作。类型变为 Number。

对于浮点数：加 1 或减 1。

对于 Object：则调用 valueOf() 方法取得可以操作的值。得到的值则根据上述规则操作。如果是 NaN，则调用 toString() 并再次应用其他规则。类型变为 Number。

let s1 = '1',
    s2 = 'a',
    s3 = true,
    s4 = false,
    s5 = 1.1,
    s6 = {valueOf() {return 1}};

console.log(++s1, --s1);  // 2 1
console.log(++s2, --s2);  // NaN NaN
console.log(++s3, --s3);  // 2 1
console.log(++s4, --s4);  // 1 0
console.log(++s5, --s5);  // 2.1 1.1
console.log(++s6, --s6);  // 2 1

②加：+；减：- 。

将加减应用于非 Number 类型会先调用 Number() 函数进行类型转换，在应用于 Object 时，操作符通常会调用 valueOf() 和/或 toString() 方法以得到可以转换的值。与自加自减类似。

let s = '1';
console.log(typeof +s);  // number

2、位操作符

①按位非（~）

作用为返回数值的一补数，即将数值的二进制数取反并减一。操作等同于：

let num = 1;
let num1 = -num - 1;
let num2 = ~num;
console.log(num1 == num2);  // true

②按位与（&）

将每个数值的二进制每位对齐，根据真值表运算。即，当两位数值同时为 1 时，该位计算结果为 1，其他情况为 0 。

③按位或（|）

按位或与按位与类似，真值表为：两位操作符有一个为 1，当位计算结果为 1，其余情况为 0 。

④按位异或（^）

按位异或运算真值表为：当两位数值相同时，运算结果为 0 。不同时运算结果为 1 。

⑤左移（<<）

将数值的二进制数向左移动指定位数，超出范围的数值去掉，然后右侧补0。

let num = 5;
let num1 = num << 5;
console.log(num.toString(2));  // 101
console.log(num1.toString(2));  // 10100000

⑥右移（>> 或 >>>）

右移与左移类似，但是分为有符号和无符号两种形式：

有符号（>>）：

二进制的第一位为符号位：1 表示负，0 表示正。

运算时符号位不动，从符号位后一位开始右移，超出范围的数值去掉，左侧空缺位补 0 。

无符号（>>>）：

无符号就没有符号位，从第一位开始右移，其余操作与有符号右移一致。

3、布尔操作符

逻辑非（!）、逻辑与（&&）、逻辑或（||）。这几个其他语言也有运用，很熟了就不多写了。

但是要注意的是，&& 和 || 有短路特性，即：使用 && 时，当第一个操作数为 false 时，就不会对第二个操作数进行判断了；使用 || 时，当第一个操作数为 true 时，就不会对第二个操作数进行判断了（短路特性）：

let bool1 = false,
    bool2 = true;
// bool 未定义
console.log(bool1 && bool);  // false
console.log(bool2 && bool);  // Uncaught ReferenceError: bool is not defined
console.log(bool1 || bool);  // Uncaught ReferenceError: bool is not defined
console.log(bool2 || bool);  // true

基于逻辑或（||）的短路特性，我们可以进行一种有趣的赋值操作：

let a = 2,
    b = 1;
let c = a || b;
console.log(c);  // 只要 a >= b , 输出的为 a 的值 , 否则为 b 的值

let a = '46',
    b = '47';
let c = a || b;
console.log(c);  // 谁在 || 的前面 , 则给 c 赋值谁的值

let a = undefined,
    b = null;
let c = a || b;
console.log(c);  // null

let Name = prompt("请输入昵称：") || "用户1";
console.log(Name);
// 若在弹出的输入框中输入输入了字符，则在控制台输出该字符，否则控制台输出 用户1

4、乘法操作符

乘法（*）、除法（/）、取模（%）。

console.log(Number.MAX_VALUE * 1.1);  // Infinity
console.log(2 * NaN);  // NaN
console.log(Infinity * 0);  // NaN
console.log(Infinity * (-2));  // -Infinity
console.log(Infinity * Infinity);  // Infinity
console.log('123' * 2);  // 246

console.log(Number.MAX_VALUE / 0.1);  // Infinity
console.log(2 / NaN);  // NaN
console.log(Infinity / Infinity);  // NaN
console.log(0 / 0);  // NaN
console.log(1 / 0);  // Infinity
console.log(Infinity / 2);  // Infinity
console.log('123' / 3);  // 41

console.log(5 % 3);  // 2
console.log(Infinity % 3);  // NaN
console.log(0 % 3);  // 0
console.log(Infinity % Infinity);  // NaN
console.log(3 % Infinity);  // 3
console.log(3 % 0);  // NaN
console.log('124' % 3);  // 1

5、指数操作符

Math.pow() 等同于 ** 操作符。指数赋值操作符：**= 。

console.log(Math.pow(3, 2));  // 9
console.log(3 ** 2);  // 9

let num = 3;
num **= 2;
console.log(num);  // 9

6、加法操作符

加号：+；减号：- 。

console.log(1 + NaN);  // NaN
console.log(Infinity + Infinity);  // Infinity
console.log(Infinity + -Infinity);  // NaN
console.log((+0) + (+0));  // 0
console.log((-0) + (+0));  // 0
console.log((-0) + (-0));  // -0
console.log('123' + '123');  // 123123
console.log('123' + 'a');  // 123a
console.log('123' + 123);  // 123123
console.log(123 + '123');  // 123123

console.log(1 - NaN);  // NaN
console.log(Infinity - Infinity);  // NaN
console.log(Infinity - (Infinity));  // Infinity
console.log(-Infinity - (Infinity));  // -Infinity
console.log((+0) - (+0));  // 0
console.log((+0) - (-0));  // 0
console.log((-0) - (-0));  // 0
console.log('123' - 3);  // 120
console.log('123' - '3');  // 120
console.log(123 - '3');  // 120
console.log(true - 1);  // 0
console.log(false - 1);  // -1
console.log(null - 1);  // -1
console.log(null - '123');  // -123
console.log(null - null);  // 0
console.log(undefined - '123');  // NaN
console.log(undefined - 1);  // NaN
console.log(undefined - null);  // NaN
console.log(undefined - undefined);  // NaN

7、关系操作符

大于：>、小于：<、大于等于：>=、小于等于：<= 。

8、相等操作符

相等：==、不相等：!=、全等：===、不全等：!== 。

相等与不相等存在类型转换问题，而全等与不全等不存在：

console.log(55 == '55');  // true
console.log(55 === '55');  // false

9、条件操作符

即问号冒号操作符（? :）：

let bool = true,
    bool1 = false;
console.log(bool? 1: 2);  // 1
console.log(bool1? 1: 2);  // 2

10、赋值操作符

等号：= 。

11、逗号操作符

在赋值时，使用逗号操作符分隔值，最终会返回表达式中最后一个值。虽然这种写法不常见，但存在：

let num = (0, 1, 2, 3, 4);
console.log(num);  // 4