Javascript之常用运算符

本文主要是介绍Javascript之常用运算符，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

在Javascript中，为了进行逻辑运算的判断，我们会使用很多的运算符。运算符（operator）也被称为操作符，是用于实现赋值、比较和执行算数运算等功能的符号。

Javascript 常见的有下面这些运算符：

• 算数运算符
• 赋值运算符
• 递增和递减运算符
• 比较运算符
• 逻辑运算符
• 三元运算符
• 位运算符
• 空值合并运算符
• 空赋值运算符
• 可选链式运算符
• 双星号运算符

接下来，我就一一介绍它们的用法及应用场景

1.算数运算符

使用场景：算术运算使用的符号，用于执行两个变量或值的算术运算。

我们都知道在日常的生活中，我们难免会进行交易，比如 你去超市买东西，会和收银员进行物品与金钱的交易，这就会使用到算数，而程序中中同样也会使用运算。程序中常用的算数运算符有：

这里，我要特别强调的一点，对于 算数运算符只针对于整数型的值，而对于浮点型会出现精度问题，所以：不要直接运算两个浮点数，因为结果可能你会出乎意料。

常见的一个经典面试题：

0.1+0.2= ?

这个题，可能很多人会毫无疑问的回答0.3，可事实结果却不是0.3，这是为什么呢？
这就是因为计算机是二进制的，对于浮点型的小数来说，并不会像现实当中进行运算，存在精度问题，那么 0.1 + 0.2 到底等于多少呢？

结果是：0.30000000000000004

如果使用一个浮点型小数去和一个整数进行运算，也不会出现你想要的答案，比如：

console.log(0.08 * 100); // 结果不是 7， 而是：8.000000000000001

2.赋值运算符

赋值运算符就是进行值或变量的赋值，等号左边等于等号右边。

赋值运算符又可以分为简单和复合两种赋值运算

常见的 赋值运算符除了有 = 之外，+=、-=、*=、/=、%=也是赋值运算符。

var num1 = 66;
var num2 = num1;
var num3 = num1 + 5;
console.log(num2);  // 输出：66
console.log(num3);  // 输出：71

3.递增和递减运算符

使用场景：如果需要反复给数字变量添加或减去1，可以使用递增（++）和递减（ – ）运算符来完成。

在 JavaScript 中，递增（++）和递减（ - - ）既可以放在变量前面，也可以放在变量后面。放在变量前面时，我 们可以称为前置递增（递减）运算符，放在变量后面时，我们可以称为后置递增（递减）运算符。 注意：递增和递减运算符必须和变量配合使用。

• 前置递增运算符 （先自加，后运算）

var num = 10;
console.log(++num + 5);   // 16

• 后置递增运算符 （先运算，后自加）

 var num = 10; 
 console.log(5 + num++); // 15

4.比较运算符

使用场景：两个数据进行比较，比较运算后，会返回一个布尔值（true / false）作为比较运算的结果。

5.逻辑运算符

使用场景：使用布尔值进行逻辑判断，逻辑运算符是用来进行布尔值运算的运算符，其返回值也是布尔值。

在逻辑运算符中，常见的是短路运算（逻辑中断）

短路运算的原理：当有多个表达式（值）时,左边的表达式值可以确定结果时,就不再继续运算右边的表达式的值。

var num1 = 123 && 456  // 456
var num2  =  0 && 123  // 0
var num3 = 123 || 456 //123
var num4 = 0 || 456  // 456
var num5 = 123 && 234 && 345 // 345 
var num6 = 123 || 234 || 345  // 123

总结：

• 逻辑与短路运算中，如果表达式1 为真，会返回表达式2的值
• 逻辑或短路运算中，如果表达式1 为真，会返回表达式1的值，如果表达式1为假，会返回表达式2的值
• 无论有多少个表达式，都会按照 上述的逻辑进行判断

这里，我说下 Javascipt中是假值的情况都有：null、undefined、""（空字符串）、+0、-0、NaN，除此之外都是真值。

6.三元运算符

使用场景：只存在真或假的情况，常使用更加方便简洁。

var flag = true;
var text = flag ? "我是真的孙悟空":"我是假的孙悟空";
console.log(text);   // 我是真的孙悟空

7.位运算符

位运算符包括 & 和 |

使用场景：基本和逻辑运算符一样，都是做逻辑判断的，结果返回为布尔值。

var num = 12 & 2   // 2 
var num1 = 32 | 6    // 32
var flag = 18 > 16 | 25< 16  // true

8.空值合并运算符 (??)

使用场景：为了解决或运算符|| 而设计出来的。
或运算符的操作|| -->当左侧的数据为假值(数字 0, 布尔类型的 false，空字符串，undefined, null)时，则执行右侧的语句
空值合并运算符??–->只会在左侧为 undefined 或者 null 时，才会执行右侧的语句

var a =  0 ; 
var r = undefined || null;
var b = a || 123;   // 此时 b =  123
var c = r ?? 456  //此时 c = 456

9.空赋值运算符（??=）

同时，空值合并运算符还可以与=结合成为一个赋值操作，当左侧为 null 或者 undefined 时，则将右侧语句的结果赋值给左侧的变量：

let x = null
let y = 5
console.log(x ??= y) // => 5 

10.可选链式运算符（?.）

使用场景：如果要访问对象的深层嵌套属性，则必须通过很长的布尔表达式去检查每个嵌套级别中的属性。必须检查每个级别中定义的每个属性，知道所需的深度嵌套的属性为止。

试想想，如果在任何级别的对象中都有undefined或null的嵌套对象，如果不进行检查，那么程序将会报错至崩溃。所以我们必须检查每个级别，确保当它遇到undefined或null对象时不崩溃。那么此时只需要使用?.来访问嵌套对象。而且如果碰到undefined或Null属性，那么它只返回undefined。

const student = {
  score: {
    math: [98, 67, () => {
        return 99;
      },
    ],
  },
};
student?.score?.math?.[2]?.(); // 99

这样写的好处，是为了避免某一个变量出现undefined或null ，致使程序出现报错。

11.双星号运算符()**

使用场景：双星号运算符**（求幂运算符）相当于 js 中 的 Math.pow() , 他执行的是一个幂运算

1 ** 2； // 1
2 ** 4； // 2 的 4 次幂  ==》  Math.pow(2,4);

在开发中，多使用这些运算符，会使我们的代码更加简洁，可读性更好。希望通过这篇文章可以对小伙伴们有所帮助。

这篇关于Javascript之常用运算符的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！