js的控制流程,类型转换,语句(分支.循环)

38 阅读2分钟

理解控制流程

  • 知道条件控制的种类并掌握语法规则

类型转换

Snipaste_2023-04-08_14-23-22.png

什么是类型转化?

  • 类型转换就是一种数据类型转换成另一种数据类型

为什么要用类型转换?

使用表单propmt获取的是字符串类型,因此不能用来加减运算 此时需要转换数据类型分可分为:显示转换和隐式转换

显示转换

就是手动告诉系统该转成什么类型,例如: 吧字符串1转成数字类型1

Number('1')

转换数字类型:

Number()

  1. 转换成功就返回一个数字类型
  2. 转换失败如在里缪按添加字母就回返回NaN

parseInt()

保留整数,只保留数字

parseFloat

保留小数,只保留整数和小数

转为数字类型

  1. String() 返回一个字符串类型
  2. 变量.toString(进制)

转为布尔值

Boolean()

返回true和false 如果值为0,-0,'',undefined,null,NaN,false,都是fasle其他都是true

隐式转换

默写运算符执行时,系统自动进行类型转换

转数字类型

  • 算术运算符: -、*、/、%, 比较运算符 > == 等
  • +号作为正号可以把字符串转换成数字型

转换为字符串型 +字符串拼接

转布尔值 !逻辑非

语句

表达式和语句

表达式:

  • 可以被求职的代码,将计算出一个结果

语句:

  • 就是一段代码,一个行为

分支语句

分支语句根据条件来判断真假选择性执行代码:

  1. if分支语句
  2. 三元运算符
  3. switch语句

if语句

if(表达式 布尔值){
成立条件执行/反之不执行}

if双分支语句

if(表达式){
满足执行
}else{
不满足执行
}

if多分支语句

if(表达式){
条件一
}else if (){
条件二
}else if (){
条件三
}else if (){
条件四
}

三元运算符(三元表达式)

使用场景: 一些简单的双分支,可以使用 三元运算符(三元表达式),写起来比 if else双分支 更简单

符号:? 与 : 配合使用

//条件 ? 表达式1 : 表达式2
//结果为真返回表达式1
//结果为假返回表达式2
consoole.log(5<3? '真的':'假的') //假的

switch语句了解 使用场景:适用于多个条件,也是分支语句,大部分情况和if语句功能相同

注意:

  • 表达式内容是布尔值
  • 配合break使用不然会曹成case穿透
  • if比itch使用的多也更重要
switch(表达式)
 case 值:
 alert('你好)
 break
}

循环语句

场景:

  • 循环指定的一段代码

while循环

while(条件)
//循环体
}
// while循环: 重复执行代码

// 1. 需求: 利用循环重复打印3次 '月薪过万不是梦,毕业时候见英雄'
let i = 1
while (i <= 3) {
  document.write('月薪过万不是梦,毕业时候见英雄~<br>')
  i++   // 这里千万不要忘了变量自增否则造成死循环
}

循环的三要素:

  1. 起始值
  2. 循环条件
  3. 变量更新(自加或者自减少)

for循环

好处:起始值,条件,变量更新写在一起让人一目了然

语法

for (初始值; 循环条件; 变量计数) {
  // 满足条件执行的循环体
}
//打印三次你好
for(let i = 1; i<=3;i++){
 alert('你好')
}

终止循环

//打印三次你好
for(let i = 1; i<=3;i++){
 if(i === 3){
 continue
 //如果i是三的话就终止本次循环
 //break是终止全部循环下面代码不执行
}
 alert('你好')
 
}

#### 无限循环


1.while(true) 来构造“无限”循环,需要使用break退出循环。(常用)

2.for(;;) 也可以来构造“无限”循环,同样需要使用break退出循环。

逻辑运算符

  1. 逻辑与 &&
  2. 逻辑或 ||
  3. 逻辑非 !

逻辑与 &&

//俩边有一个false返回false
//俩边有都是true返回true
//俩边有都是false返回false
console.log(false && false) // false
    console.log(false && true) // false
    console.log(true && false) // false
    console.log(true && true) // true
    console.log(3 > 5 && 2 < 4) // fasle

逻辑或 ||

    //俩边有一个ture返回true
 //俩边都是faalse返返回false
 //俩边有都是true返回true
    sole.log(true || false) // true
    console.log(false || false) // false
    console.log(true || true) // true

** 逻辑非 !**

// truefalse
 //falsetrue
 console.log(!false) // true
    console.log(!true) // false