第十七天到第十八天，“如果”可以“重来”

最新推荐文章于 2021-07-13 15:53:08 发布

鹿啦鹿啦

最新推荐文章于 2021-07-13 15:53:08 发布

阅读量350

点赞数

本文链接：https://blog.csdn.net/m0_45317318/article/details/109088196

版权

第十七天到第十八天，“如果”可以“重来”

课程目标
继续学习 JavaScript 的一些基本知识，比如if如果判断，for循环等

阅读
W3School 从if-else看到异常
MDN 阅读完JavaScript第一步及JavaScript基础要件

笔记
1.JavaScript If…Else 语句
（1）条件语句
在写代码时，经常会需要基于不同判断执行不同的动作。

可以在代码中使用条件语句来实现这一点。

在 JavaScript 中，我们可使用如下条件语句：

使用 if 来规定要执行的代码块，如果指定条件为 true
使用 else 来规定要执行的代码块，如果相同的条件为 false
使用 else if 来规定要测试的新条件，如果第一个条件为 false
使用 switch 来规定多个被执行的备选代码块

（2）if 语句
语法

if (条件) {
    如果条件为 true 时执行的代码
}

（3）else 语句
语法

if (条件) {
    条件为 true 时执行的代码块
} else { 
    条件为 false 时执行的代码块
}

（4）else if 语句
语法

if (条件 1) {
    条件 1 为 true 时执行的代码块
} else if (条件 2) {
    条件 1 为 false 而条件 2 为 true 时执行的代码块
 } else {
    条件 1 和条件 2 同时为 false 时执行的代码块
}

2.JavaScript Switch 语句
（1）语法

switch(表达式) {
     case n:
        代码块
        break;
     case n:
        代码块
        break;
     default:
        默认代码块
}

（2）break 关键词
如果 JavaScript 遇到 break 关键词，它会跳出 switch 代码块。

此举将停止代码块中更多代码的执行以及 case 测试。

如果找到匹配，并完成任务，则随机中断执行（break）。无需更多测试。

break 能够节省大量执行时间，因为它会“忽略” switch 代码块中的其他代码的执行。

不必中断 switch 代码块中的最后一个 case。代码

（3）default 关键词
default 关键词规定不存在 case 匹配时所运行的代码：块在此处会自然结束。

注：如果 default 不是 switch 代码块中最后一个 case，记得用 break 结束默

（4）常见的代码块
有时您会需要不同的 case 来使用相同的代码。

（5）Switching 的细节
如果多种 case 匹配一个 case 值，则选择第一个 case。

如果未找到匹配的 case，程序将继续使用默认 label。

如果未找到默认 label，程序将继续 switch 后的语句。

（6）严格的比较
Switch case 使用严格比较（===）。

值必须与要匹配的类型相同。

只有操作数属于同一类型时，严格比较才能为 true。

3.JavaScript 循环
（1）假如您需要运行代码多次，且每次使用不同的值，那么循环（loop）相当方便使用。

（2）不同类型的循环
JavaScript 支持不同类型的循环：

for - 多次遍历代码块
for/in - 遍历对象属性
while - 当指定条件为 true 时循环一段代码块
do/while - 当指定条件为 true 时循环一段代码块

4.For 循环
（1）for 循环是在您希望创建循环时经常使用的工具。

for 循环的语法如下：

for (语句 1; 语句 2; 语句 3) {
要执行的代码块
}
语句 1 在循环（代码块）开始之前执行。

语句 2 定义运行循环（代码块）的条件。

语句 3 会在循环（代码块）每次被执行后执行。

（2）语句 1
通常，您会使用语句 1 来初始化循环中所使用的的变量（i = 0）。

但情况并不总是这样，JavaScript 不会在意。语句 1 是可选的。

您可以在语句 1 中初始化多个值（由逗号分隔）：

实例

for (i = 0, len = computer.length, text = ""; i < len; i++) { 
    text += computer[i] + "<br>";

还可以省略语句 1（比如在循环开始前设置好值）：

var i = 0;
var len = computer.length;
var = text = "";
for (i = 0, len = computer.length, text = ""; i < len; i++) { 
    text += computer[i] + "<br>";

（3）语句 2
通常语句 2 用于计算初始变量的条件。

但情况并不总是这样，JavaScript 不会在意。语句 2 也是可选的。

如果语句 2 返回 true，那么循环会重新开始，如果返回 false，则循环将结束。

如果省略语句 2，那么必须在循环中提供一个 break。否则循环永远不会结束。

（4）语句 3
通常语句 3 会递增初始变量的值。

但情况并不总是这样，JavaScript 不会在意。语句 3 也是可选的。

语句 3 可做任何事情，比如负递增（i–），正递增（i = i + 15），或者任何其他事情。

语句 3 也可被省略（比如当您在循环内递增值时）

5.For/In 循环
（1）JavaScript for/in 语句遍历对象的属性

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript 循环</h1>

<p>for/in 语句循环遍历对象的属性。</p>

<p id="demo"></p>

<script>
var text = "";
var person = {name:"Rosy", sex:"女", age:20}; 
var x;
for (x in person) {
  text += person[x] + "<br/>";
}
document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

6.While 循环
while 循环会一直循环代码块，只要指定的条件为 true。

语法

while (条件) {
    要执行的代码块
}

实例
在下面的例子中，循环中的代码将运行，一遍又一遍，只要变量（i）小于 13：

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript while</h2>

<p id="demo"></p>

<script>
var text = "";
var i = 1;
while (i < 13) {
  text += i+"月<br/>";
  i++;
}
document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

7.Do/While 循环
do/while 循环是 while 循环的变体。在检查条件是否为真之前，这种循环会执行一次代码块，然后只要条件为真就会重复循环。

语法

do {
    要执行的代码块
}

while (条件);

实例：
下面的例子使用了 do/while 循环。该循环会执行至少一次，即使条件为 false，因为代码块会在条件测试之前执行：

<!DOCTYPE html>
<html>
<body>

<h2>JavaScript do ... while</h2>

<p id="demo"></p>

<script>
var text = ""
var i = 1;

do {
  text += i+"月<br>";
  i++;
}
while (i < 13);  

document.getElementById("demo").innerHTML = text;
</script>

</body>
</html>

For 与 While
while 循环与 for 循环相当类似，其中的语句 1 和语句 2 都可以省略。

9.JavaScript Break 和 Continue
（1）Break 语句
它被用于“跳出” switch 语句。
break 语句也可用于跳出循环。

break 语句会中断循环，并继续执行循环之后的代码（如果有）

（2）Continue 语句
continue 语句中断（循环中）的一个迭代，如果发生指定的条件。然后继续循环中的下一个迭代。

10.JavaScript 类型转换
(1)JavaScript 数据类型
JavaScript 中有五种可包含值的数据类型：

字符串（string）
数字（number）
布尔（boolean）
对象（object）
函数（function）

(2)有三种对象类型：

对象（Object）
日期（Date）
数组（Array）

(3)同时有两种不能包含值的数据类型：

null
undefined

11.typeof 运算符
可以使用 typeof 运算符来确定 JavaScript 变量的数据类型。

注：
NaN 的数据类型是数值
数组的数据类型是对象
日期的数据类型是对象
null 的数据类型是对象
未定义变量的数据类型是 undefined
尚未赋值的变量的数据类型也是 undefined

12.ypeof 的数据类型
typeof 运算符不是变量。它属于运算符。运算符（比如 + - * /）没有数据类型。

但是，typeof 始终会返回字符串（包含运算数的类型）。

13.constructor 属性
constructor 属性返回所有 JavaScript 变量的构造器函数。
可以通过检查 constructor 属性来确定某个对象是否为数组（包含单词 “Array”）

注：
===：三个等号我们称为等同符，当等号两边的值为相同类型的时候，直接比较等号两边的值，值相同则返回true，若等号两边的值类型不同时直接返回false。

14.JavaScript 类型转换
JavaScript 变量能够被转换为新变量以及另一种数据类型：

通过使用 JavaScript 函数
通过 JavaScript 本身自动转换

15.把数值转换为字符串
全局方法 String() 能够把数字转换为字符串。

它可用于任意类型的数字、文字、变量或表达式

16.把布尔转换为字符串
全局方法 String() 能够将布尔转换为字符串。

String(false)        // 返回 "false"
String(true)         // 返回 "true"

布尔方法 toString() 同理。

false.toString()     // 返回 "false"
true.toString()      // 返回 "true"

17.把日期转换为字符串
全局方法 String() 可将日期转换为字符串。

String(Date())      // 返回 "Tue Oct 27 2020 08:41:45 GMT+0800 (中国标准时间)"

18.日期方法 toString() 同理。

实例

Date().toString()   // 返回 "Tue Oct 27 2020 08:41:45 GMT+0800 (中国标准时间)"

19.把字符串转换为数值
全局方法 Number() 可把字符串转换为数字。

包含数字的字符串（比如 “3.14”）转换为数字（比如 3.14）。

空的字符串转换为 0。

其他字符串将转换为 NaN（Not a number，不是数字）。

Number(“3.14”) // 返回 3.14
Number(" “) // 返回 0
Number(”") // 返回 0
Number(“99 88”) // 返回 NaN

20.一元 + 运算符
一元的 + 运算符可用于把变量转换为数字:
实例

var y = "6";      // y 是字符串
var x = + y;      // x 是数字

如果无法转换变量，则仍会成为数字，但是值为 NaN（Not a number）：

实例

var y = "Rosy";   // y 是字符串
var x = + y;      // x 是数字 (NaN)

21.把布尔转换数值
全局方法 Number() 也可把布尔转换为数字。

Number(false)     // 返回 0
Number(true)      // 返回 1

22.把日期转换为数字
全局方法 Number() 可用于把日期转换为数字。

d = new Date();
Number(d)          // 返回 1603759305744

日期方法 getTime() 同理。

d = new Date();
d.getTime()        // 返回 1603759305745

22,自动类型转换
如果 JavaScript 尝试操作一种“错误”的数据类型，它会试图将该值转换为“正确”的类型。

结果并不总是你所期望的：

5 + null    // 返回 5         因为 null 被转换为 0
"5" + null  // 返回 "5null"   因为 null 被转换为  "null"
"5" + 2     // 返回 52        因为 2 被转换为 "2"
"5" - 2     // 返回 3         因为 "5" 被转换为 5
"5" * "2"   // 返回 10        因为 "5" 和 "2" 被转换为 5 和 2

23.自动字符串转换
JavaScript 自动调用变量的 toString() 函数，当您试图“输出”对象或变量时：

document.getElementById("demo").innerHTML = myVar;

// 如果 myVar = {name:"Fjohn"}  // toString 转换为 "[object Object]"
// 如果 myVar = [1,2,3,4]       // toString 转换为 "1,2,3,4"
// 如果 myVar = new Date()      // toString 转换为 "Tue Oct 27 2020 08:41:45 GMT+0800 (中国标准时间)"

24.JavaScript 位运算符

在这里插入图片描述
实例：

25.JavaScript 正则表达式
（1）什么是正则表达式？
正则表达式是构成搜索模式的字符序列。
当搜索文本中的数据时，可使用搜索模式来描述你搜索的内容。
正则表达式可以是单字符，或者更复杂的模式。
正则表达式可用于执行所有类型的文本搜索和文本替换操作。

语法

/pattern/modifiers;

实例

var patt = /w3school/i;

例子解释：
/w3school/i 是一个正则表达式。

w3school 是模式（pattern）（在搜索中使用）。

i 是修饰符（把搜索修改为大小写不敏感）

26.使用字符串方法
在 JavaScript 中，正则表达式常用于两个字符串方法：search() 和 replace()。

search() ：使用表达式来搜索匹配，然后返回匹配的位置。
replace() ：返回模式被替换处修改后的字符串。

27.使用字符串方法 search() 来处理字符串
search() 方法也接受字符串作为搜索参数。字符串参数将被转换为正则表达式：

实例
使用字符串来执行对 “W3school” 的搜索：

var str = "Visit W3School!";
var n = str.search("W3School");

结果：6

28.在字符串方法 search() 中使用正则表达式
实例
使用正则表达式执行搜索字符串中 “w3school” 的大小写不敏感的搜索：

var str = "Visit W3School";
var n = str.search(/w3school/i);

n 中的结果是：6

29.使用字符串方法 replace() 处理字符串
replace() 也接受字符串作为搜索参数：

var str = "Study English!";
var res = str.replace("English", "Math");

30.在字符串方法 replace() 中使用正则表达式
实例
使用大小写不明的正则表达式以 English 来替换字符串中的 Math：

var str = "Study English!";
var res = str.replace("English", "Math");;

res 的结果将是：Study Math!

31.正则表达式修饰符
修饰符可用于大小写不敏感的更全局的搜素：
在这里插入图片描述
31.正则表达式模式
括号用于查找一定范围的字符串：

32.元字符（Metacharacter）是拥有特殊含义的字符：

33.Quantifiers 定义量词：
在这里插入图片描述
34.使用 test()
test() 是一个正则表达式方法。
它通过模式来搜索字符串，然后根据结果返回 true 或 false。
下面的例子搜索字符串中的字符 “q”：

实例

var patt = /q/;
patt.test("qing ni chi fan!");

由于字符串中有一个 “q”，以上代码的输出将是：
true

35.exec() 方法是一个正则表达式方法。

它通过指定的模式（pattern）搜索字符串，并返回已找到的文本。

如果未找到匹配，则返回 null。

下面的例子搜索字符串中的字符 “q”：

实例

/q/.exec("qing ni chi fan");

由于字符串中有一个 “q”，以上代码的输出将是：q

36.JavaScript 错误 - Throw 和 Try to Catch

try 语句使我们能够测试代码块中的错误。
catch 语句允许我们处理错误。
throw 语句允许我们创建自定义错误。
finally 使我们能够执行代码，在 try 和 catch 之后，无论结果如何。

37.JavaScript try 和 catch
try 语句允许我们定义一个代码块，以便在执行时检测错误。

catch 语句允许我们定义一个要执行的代码块，如果 try 代码块中发生错误。

JavaScript 语句 try 和 catch 成对出现：

try {
     供测试的代码块
}
 catch(err) {
     处理错误的代码块
}

38.JavaScript 抛出错误

当发生错误时，JavaScript 通常会停止并产生错误消息。
技术术语是这样描述的：JavaScript 将抛出异常（抛出错误）。
JavaScript 实际上会创建带有两个属性的 Error 对象：name 和 message。

39.throw 语句

throw 语句允许我们创建自定义错误。
从技术上讲您能够抛出异常（抛出错误）。
异常可以是 JavaScript 字符串、数字、布尔或对象：

throw "Too big";    // 抛出文本
throw 500;          //抛出数字

如果把 throw 与 try 和 catch 一同使用，就可以控制程序流并生成自定义错误消息。

40.finally 语句
finally 语句允许您在 try 和 catch 之后执行代码，无论结果：

try {
     供测试的代码块
}
 catch(err) {
     处理错误的代码块
} 
finally {
     无论 try / catch 结果如何都执行的代码块
}

41.Error 对象
JavaScript 拥有当错误发生时提供错误信息的内置 error 对象。

error 对象提供两个有用的属性：name 和 message。

42.Error 对象属性
在这里插入图片描述
43.Error Name Values
error 的 name 属性可返回六个不同的值：

鹿啦鹿啦

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
第十七天到第十八天，“如果”可以“重来”

第十七天到第十八天，“如果”可以“重来”课程目标继续学习 JavaScript 的一些基本知识，比如if如果判断，for循环等阅读W3School 从if-else看到异常MDN 阅读完JavaScript第一步及JavaScript基础要件笔记1.JavaScript If…Else 语句（1）条件语句在写代码时，经常会需要基于不同判断执行不同的动作。可以在代码中使用条件语句来实现这一点。在 JavaScript 中，我们可使用如下条件语句：使用 if 来规定要执行的代码块，如果
复制链接

扫一扫