本篇为 JavaScript 系列笔记第二篇，将陆续更新

文章目录

一、运算符
- 1. 算术运算符
- 2. 递增和递减运算符
- 3. 比较运算符
- 4. 逻辑运算符
- 短路运算（逻辑中断）
- 5. 赋值运算符
- 6. 运算符优先级
二、流程控制——分支
- 1. if 语句
- 2. 三元表达式
- 3. switch 语句
三、流程控制——循环
- 1. for 循环
- 断点调试
- 2. 双重 for 循环
- 3. while 循环
- 4. do while 循环
- 5. continue 和 break
四、数组
- 1. 创建数组
- 2. 获取数组元素
- 3. 遍历数组
- 4. 数组中新增元素

一、运算符

运算符（operator）也被称为操作符，是用于实现赋值、比较和执行算数运算等功能的符号。

JavaScript 中常用的运算符有：

算数运算符
递增和递减运算符
比较运算符
逻辑运算符
赋值运算符

1. 算术运算符

浮点数的精度问题

浮点数值的 最高精度是 17 位小数，但在进行算术计算时其精确度远远不如整数

var result = 0.1 + 0.2;    // 结果不是 0.3，而是：0.30000000000000004
console.log(0.07 * 100);   // 结果不是 7，  而是：7.000000000000001

不要直接判断两个浮点数是否相等

2. 递增和递减运算符

在 JavaScript 中，递增（++）和递减（ – ）既可以放在变量前面，也可以放在变量后面。放在变量前面时，我们可以称为前置递增（递减）运算符，放在变量后面时，我们可以称为后置递增（递减）运算符。

1. 前置递增运算符

++num 等价于 num = num + 1 —— 先自加，后有返回值

2. 后置递增运算符

num++ 等价于 num = num + 1 —— 先有返回值，后自加

这两种用法和 c语言、java语言中用法一样，因此不再做解释

3. 比较运算符

比较运算符（关系运算符）是两个数据进行比较时所使用的运算符，比较运算后，会返回一个布尔值（true / false）作为比较运算的结果。

这里要注意 " === " 和 " !== " 的用法

4. 逻辑运算符

逻辑运算符是用来进行布尔值运算的运算符，其返回值也是布尔值。后面开发中经常用于多个条件的判断

短路运算（逻辑中断）

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

1. 逻辑与

语法： 表达式1 && 表达式2

如果第一个表达式的值为真，则返回表达式 2
如果第一个表达式的值为假，则返回表达式 1

console.log( 123 && 456 );        // 456
console.log( 0 && 456 );          // 0
console.log( 123 && 456 && 789 );  // 789

2. 逻辑或

语法： 表达式1 || 表达式2

如果第一个表达式的值为真，则返回表达式 1
如果第一个表达式的值为假，则返回表达式 2

console.log( 123 || 456 );         //  123
console.log( 0 ||  456 );          //  456
console.log( 123 || 456 || 789 );  //  123

5. 赋值运算符

var age = 10;
age += 5;  // 相当于 age = age + 5;
age -= 5;  // 相当于 age = age - 5;
age *= 10; // 相当于 age = age * 10;

6. 运算符优先级

一元运算符里面的逻辑非优先级很高
逻辑与比逻辑或优先级高

二、流程控制——分支

流程控制主要有三种结构，分别是 顺序结构、分支结构 和 循环结构，这三种结构代表三种代码执行的顺序。

JS 语言提供了两种分支结构语句

if 语句
switch 语句

1. if 语句

由上到下执行代码的过程中，根据不同的条件，执行不同的路径代码（执行代码多选一的过程），从而得到不同的结果

1. 单分支语句——if

if (条件表达式) {// 条件成立执行的代码语句
}

案例：进入网吧

var age = prompt('请输入您的年龄');
if (age >= 18) {alert('您已成年，允许进入网吧');
}

2. 双分支语句——if else

if (条件表达式) {// [如果] 条件成立执行的代码
} else {// [否则] 执行的代码
}

案例：判断闰年

var year = prompt('请输入您要检测的年份：');
if (year % 4 == 0 && year % 100 != 0 || year % 400 == 0) {alert('该年份是闰年');
} else {alert('该年份不是闰年');
}

3. 多分支语句——if else if

// 适合于检查多重条件。
if (条件表达式1) {语句1；
} else if (条件表达式2)  {语句2；
} else if (条件表达式3)  {语句3；...
} else {// 上述条件都不成立执行此处代码
}

2. 三元表达式

表达式1 ? 表达式2 : 表达式3;

如果表达式1为 true ，则返回表达式2的值，如果表达式1为 false，则返回表达式3的值

案例 ：用户输入数字，如果数字小于10，则在前面补 0 ，比如01，09 ，如果数字大于10，则不需要补，比如 20

var num = prompt('请输入一个数字：');
num = num < 9 ? '0' + num : num;
alert(num);

3. switch 语句

switch 语句也是多分支语句，它用于基于不同的条件来执行不同的代码。当要针对变量设置一系列的特定值的选项时，就可以使用 switch。

switch( 表达式 ){ case value1:// 表达式 等于 value1 时要执行的代码break;case value2:// 表达式 等于 value2 时要执行的代码break;default:// 表达式 不等于任何一个 value 时要执行的代码
}

注意：

switch 表达式值会与 case 的值做全等匹配（===）

案例 ：查询水果价格

var fruit = prompt('请您输入查询的水果:');
switch (fruit) {case '苹果':alert('苹果的价格是 3.5/斤');break;case '榴莲':alert('榴莲的价格是 35/斤');break;default:alert('没有此水果');
}

三、流程控制——循环

在Js 中，主要有三种类型的循环语句：

for 循环
while 循环
do…while 循环

1. for 循环

for (初始化变量; 条件表达式; 操作表达式) {//循环体
}

初始化变量：通常被用于初始化一个计数器，该表达式可以使用 var 关键字声明新的变量，这个变量帮我们来记录次数
条件表达式：用于确定每一次循环是否能被执行。如果结果是 true 就继续循环，否则退出循环
操作表达式：每次循环的最后都要执行的表达式。通常被用于更新或者递增计数器变量

案例 ：求1-100之间所有整数的累加和

var sum = 0;
for(var i = 1;i <= 100; i++){sumNum += i;
}
console.log('1-100之间整数的和 = ' + sum);

断点调试

打开HTML页面，点击 F12 可以进行断点调试

2. 双重 for 循环

很多情况下，单层 for 循环并不能满足我们的需求，比如我们要打印一个 5 行 5 列的图形、打印一个倒
直角三角形等，此时就可以通过循环嵌套来实现。

循环嵌套 是指在一个循环语句中再定义一个循环语句的语法结构，例如在 for 循环语句中，可以再嵌套一个 for 循环，这样的 for 循环语句我们称之为 双重 for 循环

3. while 循环

while (条件表达式) {// 循环体代码
}

使用 while 循环时一定要注意，它必须要有退出条件，否则会成为死循环
while 循环和 for 循环的不同之处在于 while 循环可以做较为复杂的条件判断，比如判断用户名和密码

4. do while 循环

do {// 循环体代码 - 条件表达式为 true 时重复执行循环体代码
} while(条件表达式);

先执行一次循环体代码
再执行条件表达式，如果结果为 true，则继续执行循环体代码，如果为 false，则退出循环，继续执行后面代码

5. continue 和 break

continue 关键字用于立即跳出本次循环，继续下一次循环
break 关键字用于立即跳出整个循环

四、数组

// 普通变量一次只能存储一个值
var  num = 10;
// 数组一次可以存储多个值
var arr = [1,2,3,4,5];

1. 创建数组

JS 中创建数组有两种方式

利用 new 创建数组

var 数组名 = new Array();
var arr = new Array();   // 创建一个新的空数组

利用数组字面量创建数组

var  数组名 = []；
var  数组名 = ['小白','小黑','大黄','瑞奇'];

数组中可以存放任意类型的数据，例如字符串，数字，布尔值等

var arrStus = ['小白',12,true,28.9];

2. 获取数组元素

索引 (下标) ：用来访问数组元素的序号（数组下标从 0 开始）

数组可以通过索引来访问、设置、修改对应的数组元素，我们可以通过“数组名[索引]”的形式来获取数组中的元素

// 定义数组
var arrStus = [1,2,3];// 获取数组中的第 2 个元素
alert(arrStus[1]);

3. 遍历数组

可以通过 for 循环 索引遍历数组中的每一项

var arr = ['red','green', 'blue'];
for(var i = 0; i < arr.length; i++){console.log(arrStus[i]);
}

数组长度

使用 数组名.length 可以访问数组元素的数量（数组长度）

var arrStus = [1,2,3];
alert(arrStus.length);  // 3

4. 数组中新增元素

通过修改 length 长度新增数组元素

可以通过修改 length 长度来实现数组扩容的目的
length 属性是可读写的

var arr = ['red', 'green', 'blue', 'pink'];
arr.length = 7;
console.log(arr);
console.log(arr[4]);
console.log(arr[5]);
console.log(arr[6]);

其中索引号是 4，5，6 的空间没有给值，就是声明变量未给值，默认值就是 undefined

通过修改数组索引新增数组元素

可以通过修改数组索引的方式追加数组元素
不能直接给数组名赋值，否则会覆盖掉以前的数据

var arr = ['red', 'green', 'blue', 'pink'];
arr[4] = 'hotpink';
console.log(arr);

案例： 将数组中大于等于 10 的元素选出来，放入新数组

新数组里面的个数，用 length 不断累加

JavaScript（二）—— JavaScript 运算符/JavaScript 流程控制/JavaScript 数组相关推荐

Java基础语法之变量、运算符、流程控制、数组和方法等基础语法
变量.运算符.流程控制.数组和方法等基础语法.Java程序的执行流程,符合Java语法规则的程序. 1.1.1 Java初识对Java进行简单介绍,Java程序如何执行,以及Java程序的结构. J ...
Javascript - 1 引入方式，变量常量，数据类型，运算符，流程控制，数组，函数，对象，DOM
Javascipt:是一门弱类型的脚本语言,需要在网页上执行. html负责框架结构,css负责样式修饰,js负责行为交互,动态效果. 前端三大件:html,css,js. javascript 和 ...
小汤学编程之JavaScript学习day02——运算符、流程控制与循环、函数
一.运算符 1.算术运算符 2.一元运算符 3.关系运算符 4.逻辑运算符 5.赋值运算符 6.运算符的优先级二.流程控制与循环 1.顺序结构 2.分 ...
Python基础（二）--数据类型，运算符与流程控制
目录 Python基础(二)--数据类型,运算符与流程控制 1 数据类型 1.1 Python中的数据类型 1.2 整数类型(int) 1.3 布尔类型 1.4 浮点类型 1.5 复数类型 1.6 类 ...
好好学python·运算符和流程控制
运算符和流程控制运算符类型 Python算术运算符 Python比较运算符 Python赋值运算符 Python位运算符 Python逻辑运算符 Python成员运算符 Python身份运算符 Py ...
java学习笔记2(datawhale教程):运算符和表达式、流程控制、数组
java学习笔记2(datawhale教程):运算符和表达式.流程控制.数组文章目录 java学习笔记2(datawhale教程):运算符和表达式.流程控制.数组一.运算符和表达式 1.数学函数与 ...
Java的基础语法：变量、运算符、注释、流程控制、数组
文章目录一:标识符.注释标识符 Java的名称命名规范注释二:变量什么是变量变量的分类基本数据类型数据类型之间运算规则三:运算符算术运算符赋值运算符比较运算符逻辑运算符位运 ...
ChapterTwo---Java基本语法：变量、运算符与流程控制（上）
ChapterTwo---Java基本语法:变量.运算符与流程控制(上) ⑴关键字和保留字 ⑵标识符(Identifier) ⑶变量以及基本数据类型整数类型:byte.short.int.long ...
java的注释、关键字、标识符、变量常量、数据类型、运算符、流程控制等
java的注释.关键字.标识符.变量常量. 数据类型.运算符.流程控制等 1. java概述 1.1 java的技术体系 Java SE:是Ja ...
python 运算符与流程控制
运算符与流程控制运算符赋值运算用'='表示,'='的左边只能是变量算术运算 +.-.*:加.减.乘 /:除法运算,运算结果为浮点数 //:除法运算,运算结果为整数(商) %:求余 **:求幂 ...

JavaScript（二）—— JavaScript 运算符/JavaScript 流程控制/JavaScript 数组