JavaScript分支语句和逻辑运算符

一、条件语句

JavaScript 提供if结构和switch结构,完成条件判断,即只有满足预设的条件,才会执行相应的语句。

1.if语句

if结构先判断一个表达式的布尔值,然后根据布尔值的真伪,执行不同的语句。

if (布尔值)
    语句;
// 或者
if (布尔值) 语句;

布尔值”往往由一个条件表达式产生的,必须放在圆括号中,表示对表达式求值。

if (m === 3)
    m = m + 1;

这种写法要求条件表达式后面只能有一个语句。如果想执行多个语句,必须在if的条件判断之后,加上大括号,表示代码块(多条语句合并成一条语句)

建议总是在if语句中使用大括号,因为这样方便插入语句。

if (…) 语句会计算圆括号内的表达式,并将计算结果转换为布尔型(Boolean)。

  • 转换规则和Boolean函数的规则一致;
  • 数字 0、空字符串 “”、null、undefined 和 NaN 都会被转换成 false
    • 因为它们被称为“假值(false)”;
  • 其他值被转换为 true,所以它们被称为“真值(truthy)”;
var x = 2;
var y = 0;
if (x = y) {
    console.log("aaa");
}
// aaa

上面代码的原意是,当x等于y的时候,才执行相关语句。但是,不小心将严格相等运算符写成赋值表达式,结果变成了将y赋值给变量x,再判断变量x的值(等于2)的布尔值(结果为true)。

2.if-else语句

if代码块后面,还可以跟一个else代码块,表示不满足条件时,所要执行的代码。

if (m === 3) {
  // 满足条件时,执行的语句
} else {
  // 不满足条件时,执行的语句
}

对同一个变量进行多次判断时,多个if...else语句可以连写在一起。

if (m === 0) {
  // ...
} else if (m === 1) {
  // ...
} else if (m === 2) {
  // ...
} else {
  // ...
}

else代码块总是与离自己最近的那个if语句配对。

var m = 1;
var n = 2;

if (m !== 1)
if (n === 2) console.log('hello');
else console.log('world');
// 相当于
if (m !== 1) {
  if (n === 2) {
    console.log('hello');
  } else {
    console.log('world');
  }
}

3.switch语句

多个if...else连在一起使用的时候,可以转为使用更方便的switch结构

  • 它是通过判断表达式的结果(或者变量)是否等于case语句的常量,来执行相应的分支体的;

与if语句不同的是,switch语句只能做值的相等判断(使用全等运算符 ===),而if语句可以做值的范围判断,这意味着比较时不会发生类型转换

switch的语法:

  • switch 语句有至少一个 case 代码块和一个可选的 default 代码块。
switch (fruit) {
  case "banana":
    // ...
    break;
  case "apple":
    // ...
    break;
  default:
    // ...
}

switch语句部分和case语句部分,都可以使用表达式。

switch (1 + 3) {
  case 2 + 2:
    f();
    break;
  default:
    neverHappens();
}

4.三元运算符

JavaScript 还有一个三元运算符(即该运算符需要三个运算子)?:,也可以用于逻辑判断。

(条件) ? 表达式1 : 表达式2

这个三元运算符可以被视为if...else...的简写形式,因此可以用于多种场合。

var myVar;
console.log(
  myVar ?
  'myVar has a value' :
  'myVar does not have a value'
)
// myVar does not have a value

二、逻辑运算符

1.认识逻辑运算符

逻辑运算符,主要是由三个:

  • ||(或),&&(与),!(非)
  • 它可以将多个表达式或者值放到一起来获取到一个最终的结果;

有了逻辑运算符,我们就可以在判断语句中编写多个条件。

2.逻辑或

||(或)两个竖线符号表示“或”运算符(也称为短路或):

  • 从左到右依次计算操作数。
  • 处理每一个操作数时,都将其转化为布尔值(Boolean);
  • 如果结果是 true,就停止计算,返回这个操作数的初始值。
  • 如果所有的操作数都被计算过(也就是,转换结果都是 false),则返回最后一个操作数。

注意:返回的值是操作数的初始形式,不会转换为Boolean类型。

var a = 10;
var b = 20;
var c = a || b;// 10

换句话说,一个或运算 || 的链,将返回第一个真值,如果不存在真值,就返回该链的最后一个值

var x = 1;
true || (x = 2) // true
x // 1

3.逻辑与

&&(或)两个竖线符号表示“与”运算符(也称为短路与):

  • 从左到右依次计算操作数。
  • 在处理每一个操作数时,都将其转化为布尔值(Boolean);
  • 如果结果是 false,就停止计算,并返回这个操作数的初始值(一般不需要获取到初始值);
  • 如果所有的操作数都被计算过(例如都是真值),则返回最后一个操作数。
true && 'foo' && '' && 4 && 'foo' && true
// ''

1 && 2 && 3
// 3

换句话说,与运算 返回第一个假值,如果没有假值就返回最后一个值

if (i) {
  doSomething();
}

// 等价于

i && doSomething();

4.! 取反

逻辑非运算符接受一个参数,并按如下运算:

  • 步骤一:将操作数转化为布尔类型:true/false;
  • 步骤二:返回相反的值

两个非运算 !! 有时候用来将某个值转化为布尔类型:

  • 也就是,第一个非运算将该值转化为布尔类型并取反,第二个非运算再次取反。
  • 最后我们就得到了一个任意值到布尔值的转化。
var a = 10;
var b = !!a;//true
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值