JS运算符
语句和表达式
笼统来说,一个语句表示执行了一个动作。
如:
- 赋值语句
- for循环语句
- if判断语句
- ...
一个程序就是由一系列的语句组成。而语句中可能会包含一些表达式。
表达式: 表达式最大的特点是会产生一个值,并且可以写在任何需要值的地方。
示例:
// 当条件表达式为真值时,执行语句1,否则执行语句2
if(条件表达式) {
// 语句1
} else {
// 语句2
}
示例:
var age = 20;
var age1 = 10; // 赋值语句 ,10 => 表达式
var age2 = 20; // 赋值语句, 20 => 表达式
var age3 = age1 + age2; // age1 + age2 => 表达式
if(age > 18){ // if是语句,里面的 age > 18 就是表达式
console.log('成年了')
}else{
console.log('未成年')
}
一般情况下一个语句后面都要以一个分号;
作为语句的结尾。
而一些特殊的语句结构我们是不需要加分号的,如上面的if语句。
运算符(操作符)
什么是运算符?
可以进行运算的符号。
运算符的划分:
- 运算符也叫操作符,按照操作数的个数不同分为:
运算符分类:
- 一元(目)运算符。即有一个操作数的。
- 二元运算符
- 三元运算符
// 一元运算符
var num = 100;
num++; // 一元运算符++ 让num累加1
num--; // 一元运算符-- 让num自减1
// 二元运算符
var a = 10, b = 20;
var c = a + b;
// 三元运算符 ?:
var age = 30
var str = age <= 18 ? "太年轻" : "足够成熟";
算术运算符
算术运算符用于执行变量与/或值之间的算术运算。
假设:y=5,下面的表格解释了这些算术运算符:
运算符 | 描述 | 例子 | 结果 |
---|---|---|---|
+ | 加 | x=y+2 | x=7 |
- | 减 | x=y-2 | x=3 |
* | 乘 | x=y*2 | x=10 |
/ | 除 | x=y/2 | x=2.5 |
% | 求余(取模) | x=y%3 | x=2 |
++ | 累加 | x=++y | x=6 |
-- | 递减 | x=--y | x=4 |
= | 赋值 | x=y | x=5 |
代码如下:
var v1 = 10;
var v2 = 20;
console.log(v1+v2); // 30
console.log(v1-v2); // -10
console.log(v1*v2); // 200
console.log(v1/v2); // 0.5
console.log(3%10); // 3 求余求不下返回3本身
console.log(10%2); // 0 整数余数为0
console.log(9%4); // 1 余数为1
var a = 1;
var b = 2;
var c = b = a; // 连续赋值从右到左, a的值赋值给b,再把b的值赋值给c
console.log(b); // 1
console.log(c); // 1
逗号运算符
逗号操作符可以用来在一条语句中执行多个操作,如:声明多个变量
var a = 1, b = 2, c = 3;
// 等价于
var a = 1;
var b = 2;
var c = 3;
比较运算符(返回布尔类型值)
比较运算符执行的是比较运算。每个比较运算符都返回一个布尔值类型的值
。结果为:true或者是false
假设:x = 10, y=5 下面的表格解释了比较运算符的结果:
运算符 | 描述 | 例子 | 结果 |
---|---|---|---|
大于 | x>y | true | |
< | 小于 | x<y | false |
>= | 大于等于 | x>=y | true |
<= | 小于等于 | x<=y | false |
== | 相等 (要求值相等) | x==y | false |
!= | 不等 | x!=y | true |
=== | 全等 (要求值和类型都相等) | x === y | false |
!== | 不全等 | x !== y | true |
代码如下:
var v1 = 10;
var v2 = 5;
console.log(v1 > v2); // true
console.log(v1 < v2); // false
console.log(v1 >= v2); // true
console.log(v1 <= v2); // false
console.log(v1 == v2); // false
console.log(v1 != v2); // true 如果是不等于 ,就为true, 等于就是false
==与===的区别:==只进行值得比较,===要求类型和值同时相等
console.log('10' == 10); // true 两个等于号只需要比较值是否相等 ,不需要比较变量的类型
console.log('10' === 10); // false 判断是否全等于,需要比较值相同, 的同时还需要比较类型是不是一样的
console.log(0 != '0') // false //
console.log(0 !== '0') // true //
强烈建议用===
全等来进行判断,让程序更加健壮,避免类型导致的错误
var number = '100'
if (number === 100) {
console.log('为100')
} else {
console.log('不为100')
}
//null 与 undefined 的不同点:
console.log(undefined == null); // true 值相等
console.log(undefined === null); // false 值相等,但类型不等
//假值得比较
console.log(undefined == null) // true 值相等,我们希望是false
console.log(undefined === null) // false 类型不等
console.log(NaN == NaN); // false 我们希望是true
// es6:有个Object.is(值1,值2),仅判断值相等,更加符合我们思维方式
console.log(Object.is(undefined, null)) // false
console.log(Object.is(NaN, NaN)) // true
console.log(0 == 0); // true
console.log(-0 == +0); // true, 我们希望是false
console.log(Object.is(0, -0)) // false
//项目中是不会出现以上的特殊值比较,
//因为没有意义,
//就算有我们也会进行类型转换后再比较
逻辑运算符(返回真值或假值)
符号 | 说明 | 功能 | |
---|---|---|---|
&& | 逻辑与(并且) | 要求所有的操作数都为真值,整个结果就是真值,会返回最后一个真值。如果遇到一个假值,整个结果就是假值。会返回第一个假值 | |
逻辑或 (或者) | 只要有一个操作数为真值,整个结果就是为真值。会返回第一个真值只有都为假值,整个结果才为假值,会返回最后一个假值 | ||
! | 逻辑非 (取反) | 取反操作 将真值变为false 将假值变为true |
假值(6种):''、0、 undefined、 false、NaN、null ,除了这6种其他的都是真值。
逻辑与 &&:
console.log( true && true ); // true
console.log( true && 1 ); // 1
console.log( true && 1 && 2 ); // 2
console.log( true && false ); // false
console.log( true && false && 100); // false
console.log( '' && false && 100); // ''
console.log( '1' && true && 100); // 100
console.log( 1 && 2 && 3); // 3
console.log( 1 && 0 && 3); // 0
console.log( 1 && 2 && 0); // 0
console.log( 0 && 2 && 0); // 0
console.log( '' && 0 && 1); // ''
左值 && 右值; 如果 && 左边出现假值,右边则根本不会执行
// 0 && alert('ok'); // 不会弹出ok
var age = 15;
// if(age > 18){
// alert('成年了')
// }
age > 18 && alert('成年了')
逻辑或||:
console.log( 10 || 0 ); // 10
console.log( 10 || 12 || 0 ); // 10
console.log( 10 || 12 ); // 10
console.log( false || 0 ); // 0
console.log( false || 0 || 100); // 100
console.log( false || true); // true
console.log( 1 || true ); // 1
console.log( '' || 100 ); // 100
console.log( undefined || true ); // true
逻辑或||,可以做一些设置默认值判断
// 如:有QQ有设置签名则显签名,否则显示默认签名
var sign = "";
var result = sign || "这人很懒,什么都没留下";
console.log(result); // "这人很懒,什么都没留下"
// 逻辑与&&,可以做一些前置条件判断,如某事成立则继续做下一个事。
4 % 2 == 0 && alert('偶数')
逻辑非(取反):
console.log(!true)
console.log(!false);
var age = 20;
console.log(!age);
var num = 0;
console.log(!num); // true
var num = '0';
console.log(!num); // false
var myAge = 20;
console.log(!myAge); // false
//!!变量名:把变量转化为布尔类型的值。
console.log(!!myAge); // true
var abc = 0;
console.log(!!abc); // false
可以通过两次逻辑非运算来得到一个值的布尔值:!!x
;
复合运算符
给定 x=10 和 y=5,下面的表格解释了赋值运算符:
运算符 | 示例 | 等价于 | 结果 |
---|---|---|---|
= | x = y | x=5 | |
+= | x += y | x = x+y | x=15 |
-= | x -= y | x -= y | x=5 |
*= | x *= y | x=x*y | x=50 |
/= | x /= y | x=x/y | x=2 |
%= | x %= y | x=x%y | x=0 |
注意:
+=
等这些运算符号是写在一起的,中间不允许出现空格
var num = 3;
num += 5; //相当于 num = num + 5;
console.log(num); // 8
var a = 10;
a *= 5; // 等价于 a = a * 5
console.log(a); // 50
三元运算符
语法:? :
表达式的值为真值,则把值1赋值给变量,否则把值2赋给变量。
var 变量 = 表达式 ? 值1 : 值2
// 判断一个数是否是偶数
var num = 4;
let isEven = num % 2 == 0 ? true : false
// 求x的绝对值
var x = 100;
x = x > 0 ? x : -x;
++
与--
这两个运算符的规则是一样的。
- 前加加:
++
符号在变量的前面 比如:++a; 其运算规则:先自身加1, 后再参与运算 - 后加加: 符号在变量的后面 比如:a++; 其运算规则:先参与运算,后自身加1
前减减后减减同理
运算符的优先级
优先级从高到底排列:
- () 优先级最高
- 一元运算符 ++ -- !
- 算数运算符 先* / % 后 + -
- 关系运算符 > >= < <=
- 相等运算符 == != === !==
- 逻辑运算符 先&& 后||
- 赋值运算符 =
var result = 4 >= 6 || '人' != '阿凡达' && !(12 * 2 == 144) && true;
console.log(result); // ?
var a = 10;
var b = 20;
var c = 10 && 20;
var result3 = c && b && a > b;
console.log(result3); // ?
var c = 10;
var d = 20;
var e = c || d;
var result4 = e && 0 === '0' || d == e;
console.log(result4); // ?
转载自:https://juejin.cn/post/7236668944341745719