基本数据类型String、null和undefined、运算符(算术、比较、逻辑、赋值、一元)、流程控制语言(if，switch

【一】基本数据类型String

• String类型就是字符串类型

【1】语法

var 变量名="变量值";

【2】演示

var a = "chosen";
//undefined
typeof a;
//'string'

【3】模板字符串

（1）书写多行字符串

var s1=`
ig
JD
cn
df
`

（2）格式化字符串

• 书写 ${} 会向前找定义过的变量值

var name="chosen";
var age=20;
var sentence=`my name is ${name} , my age is ${age}`

（3）字符串拼接

• 直接用 + 号拼接

【4】字符串常用方法

（1）统计字符串长度

sentence.length
// 32

（2）移除两侧空白trim()

var gender="  male  ";
var newGender=gender.trim();
newGender;
// 'male'

（3）移除左右一侧空白trimLeft()/trimRight()

var gender="  male  ";
var newGender=gender.trimLeft();
newGender;
// 'male  '

var newGender=gender.trimRight();
newGender;
// '  male'

（4）返回指定索引位置的字符charAt()

// 索引位置都是从0开始的
sentence;
// 'my name is chosen , my age is 20'
sentence.charAt(1);
// 'y'

（5）拼接字符串concat()

gender.concat("max,","tom");
// '  male  max,tom'

（6）返回指定字符的索引位置（重要）indexOf()

sentence;
// 'my name is chosen , my age is 20'
sentence.indexOf('n');
// 3

（7）切片slice()

// 语法要求(顾头不顾尾)
// sentence.slice(start_index,end_index)

sentence;
// 'my name is chosen , my age is 20'
sentence.slice(0,5);
// 'my na'

（8）转换大小写toUpperCase()/toLowerCase()

sentence.toUpperCase();
// 'MY NAME IS CHOSEN , MY AGE IS 20'
sentence.toLowerCase();
// 'my name is chosen , my age is 20'

（9）切割split()

sentence.split(" ");
// ['my', 'name', 'is', 'chosen', ',', 'my', 'age', 'is', '20']

【二】null和undefined

【1】null

• 表示值为空，一般都是指定或者清空一个变量时使用

【2】undefined

• 表示声明了一个变量，但是没有做初始化操作
• 函数没有指定返回值的时候也是返回的undefined

【三】运算符

【1】算术运算符

// + : 加法
1 + 1
// 2

// - : 减法
2 - 1
// 1

// * : 乘法
3 * 3
// 9

// / : 除法
4 / 2
// 2

// (): 优先运算
4 + (2 * 3)
// 10

// % : 取余
8 % 5
// 3

（1）运算顺序

• 先乘除取余，再算加减，有括号先算括号

（2）特殊NaN

• 只要 NaN 参与运算得到的结果都是 NaN

（3）隐式转换

• 隐式转换：null 转换成0 ，undefined 转换成 NaN 等

g=null;
// null
g+9;
// 9

x=undefined;
// undefined
x+5;
// NaN

【2】比较运算符

• > 大于
• < 小于
• <= 小于等于
• >= 大于等于
• == 相等，弱比较，只比较值，不强制约束类型
• != 不相等
• === 强等 既比较值也比较类型
• !== 不全等

（1）与=示例

a=1;
// 1
b="1";
// '1'
a==b;
// true

a===b;
// false

（2）特殊NaN

• NaN是Not a Number的缩写，表示一种特殊的浮点数，它与任何数值都不相等，包括自己。

isNaN(NaN) // true
isNaN(Infinity) // false
isNaN(-Infinity) // false
isNaN("hello") // true
isNaN(true) // false
NaN == NaN; // false

（3）Infinity

• 正无穷：Infinity
• 负无穷：-Infinity

Infinity == Infinity // true
Infinity != Infinity // false
Infinity < Infinity // false
Infinity >= Infinity // true

（4）null

null >=0 
// true

null <=0 
// true

null==undefined
// true

• 只有在算数运算的时候会默认将 null 转换为 0 运算

（5）字符串相比较

• 默认按照 ASCII 码的顺序进行比较

【3】逻辑运算符

• && 与
• || 或
• ! 非

// 任一为真则为真，二者都为真则取前者
5 && "5";
// '5'

0 || 1;
// 1
2 || 3;
// 2

!5 && "5";
// false

【4】赋值运算

• = 等于
• += 加等于 例如： a+=3 等价于 a=a+3 下面基本一致
• -= 减等于
• *= 乘等于
• /= 除等于
• %= 取余等于
• ++ 递加
• -- 递减

【5】一元运算符

（1）++a

• 先增加再赋值

var a=10;
// undefined
var res=++a;
// undefined
res;
// 11
a;
// 11

（2）a++

• 先赋值再增加

a=10;
// 10
res=a++;
// 10
res;
// 10
a;
// 11

（3）--

• 用于减少变量的值

let a = 10;
console.log(a); // 输出：10

a--;
console.log(a); // 输出：9

let b = "hello";
b--;
// NaN

console.log(b); 
// NaN

【6】运算优先级

• () -> 一元 -> 算数 -> 比较 -> 逻辑 -> 赋值
• 括号最高
• 一元运算
• 算数运算
• 关系运算
• 相等运算
• 逻辑运算 先&& 再 ||
• 赋值运算

【四】流程控制语句

【1】if 判断

（1）语法

// if (单分支)
if(条件){代码块}
// if - else (双分支)
if (条件){条件成立执行的代码块}else{条件不成立时执行的代码块}
// if - else if - else (多分支)
if (条件){条件成立执行的代码块}else if(条件){条件成立执行的代码块}else{条件不成立时执行的代码块}


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

（2）示例

// 单分支
var score = 99;
if (score>90) {
    console.log("优秀");
}
// 双分支
var score = 88;
if (score>=90) {
    console.log("优秀");
}else {
    console.log("良好");
}
// 多分支
var score = 60;
if (score>=90) {
    console.log("优秀");
}else if (score>=80){
    console.log("良好");
}else {
    console.log("不及格");
}

【五】分支结构

【1】switch ~ case 结构语法

• 提前定义好可能出现的条件和解决方式

• break

• • 如果不加break，匹配成功之后会依次执行

• default

• • 所有条件都不成立时走的代码

var score = 65;
switch (score) {
    case 98:
        console.log("你已经很棒了");
        break
    case 60:
        console.log("还需努力");
        break
    default:
        console.log("中规中矩")
}
// 中规中矩

【2】for 循环

（1）语法

for (起始条件，结束条件，循环条件){条件成立执行的代码}

（2）打印0-9的数字

for (var a=0;a<10;a++){
    console.log(a)
}

（3）打印列表内的每一个值

var num_list = [0,1,2,3,4,5,6,7];
for (a=0;a<num_list.length;a++){
    console.log(num_list[a])
}

（4）for循环+switch~case

• 捕获布尔值类型要用 if 语句
• 捕获指定的值要用 case 语句

for (a=0;a<10;a++){
    var res = a % 2
    console.log(res === 0,typeof res)
    switch (res){
        case 0:
            console.log(`这是偶数 ${a}`)
            break
        case 1:
            console.log(`这是奇数 ${a}`)
    }
}

【六】循环结构

【1】while 循环

（1）语法

while (条件){条件成立执行的代码}

（2）示例

var count = 1
while (count<5){
    console.log(count)
    count++
}
// 1
// 2
// 3
// 4

【2】do ~ while 循环

（1）语法

do {
  // 执行的代码
} while (条件);

（2）示例

var count = 0
do{
    console.log(count)
    count++
} while (count<5)
// 0
// 1
// 2
// 3
// 4 

【七】三元运算

【1】语法

条件 ？ 条件成立取到的值:条件不成立取到的值

【2】示例

0?1:0;
// 0

var res = 1 > 2 ? 4 : 6;
// 6

var res = 1 > 2 ? 4 : (8 > 5 ? 999 : 888);
// 999

【八】数组

【1】什么是数组

• 数组是一组有序的数据集合，数组内部可以存放多个数据，不限制数据类型，数组的长度可以动态调整
• 数组类似于Python当中的列表

【2】创建数组

• 方式一：创建数组的最简单方式通过自变量

var arr=[];

• 方式二：也可以通过数组对象去创建

var arr =new Array();

• 示例

num_list_one = Array;
// ƒ Array() { [native code] }
num_list_two = Array();
// []

【3】数组的索引取值

// 索引也是从0开始
var numList = [1,2,3,4,5,6,7,8,9,10];
// undefined
numList[0];
// 1
numList[2];
// 3

• 获取数组长度

numList.length;
// 10

【九】数组的内置方法（部分）

方法名称	功能描述	返回值类型	是否改变原数组
forEach/for...of	遍历数组（forEach处理每个元素，for...of可读取元素并自动解包）	无	不会
concat	合并数组	新数组	不会
join	将数组转化为字符串	字符串	不会
pop	删除数组最后一个元素	删除的数据（即数组最后一个元素）	会
shift	删除数组第一个元素	删除的数据（即数组第一个元素）	会
unshift	在数组开头插入元素	新数组长度	会
push	在数组末尾添加元素	新数组长度	会
reverse	翻转数组顺序	翻转后的数组	会
sort	对数组元素排序	排序后的数组	会
slice	截取数组部分元素	新数组	不会
splice	插入、删除或替换数组元素	被删除或替换的元素	会
toString	数组转为字符串	字符串	不会
valueOf	获取数组原始值	原始值	不会
indexOf	查找指定元素在数组中的位置	元素索引（若不存在则返回 -1）	不会
lastIndexOf	查找指定元素在数组中最后一次出现的位置	元素索引	不会
map	应用函数映射数组元素	新数组	不会
filter	根据条件筛选数组元素	新数组	不会
every	判断数组所有元素是否都满足条件	布尔值	不会
some	判断数组是否有元素满足条件	布尔值	不会
reduce	按规则累积数组元素生成单个返回值	单一返回值	可以，但通常不会直接改变原数组
rightReduce	类似于reduce，但从数组末尾开始累积	单一返回值	可以，但通常不会直接改变原数组

【1】forEach 和 for...of

• 遍历数组（forEach处理每个元素，for...of可读取元素并自动解包）

var numList = [1,2,3,4,5,6,7,8,9,10];
var numListOne = new Array();
var numListTwo = new Array();

// 遍历数组中的每一个数据 数组.forEach
numList.forEach((value,index)=>{
    // value 是当前列表索引所对应的值
    console.log(`value:>>>>>${value}`)
    // index 是当前值所对应的索引
    console.log(`index:>>>>>${index}`)
    let res = value + value
    // 向数组中添加元素 push 默认添加在结尾
    numListOne.push(res)
    // [2, 4, 6, 8, 10, 12, 14, 16, 18, 20]

    // 向数组中添加元素 unshift 默认添加在开头
    numListTwo.unshift(res)
    // [20, 18, 16, 14, 12, 10, 8, 6, 4, 2]
})

// 遍历数组中的每一个数据 for ~ of
for (let item of numList) {
    console.log(item)
}

// forEach方法
// 一个参数的时候，参数是数组中的每一个元素
numListOne.forEach((value)=>{
    console.log(value)
})
// 两个参数的时候，前面的是每一个元素 后面的是每一个元素的索引
numListOne.forEach((value,index)=>{
    console.log(value)
})
// 三个参数的时候
// value每一个元素 index每一个元素的索引 attr是整个原始的数组
numListOne.forEach((value,index,attr)=>{
    console.log(value)
    console.log(index)
    console.log(attr)
})

【2】pop 和 shift

• pop删除数组最后一个元素
• shift删除数组第一个元素

// 从数组中删除元素 pop 默认弹出最后一个位置的元素
numListOne.pop();
// 20
numListOne;
// [2, 4, 6, 8, 10, 12, 14, 16, 18]

// 从数组中删除元素 shift 默认弹出第一个位置的元素
numListTwo.shift()
// 20
numListTwo;
// [18, 16, 14, 12, 10, 8, 6, 4, 2]

【3】join

• 将数组转化为字符串

let arr = ['apple', 'banana', 'cherry'];
let str = arr.join(', '); // "apple, banana, cherry"
console.log(str);
// apple, banana, cherry
// undefined
arr;
// ['apple', 'banana', 'cherry']
str;
// 'apple, banana, cherry'

numListOne.join('|');
// '2|4|6|8|10|12|14|16|18'

【4】concat

• 合并数组

numListTwo;
// [18, 16, 14, 12, 10, 8, 6, 4, 2]
numListThree = [7, 8, 9];
numListTwo.concat(numListThree);
// [18, 16, 14, 12, 10, 8, 6, 4, 2, 7, 8, 9]

【5】reverse

• 翻转数组顺序

numListOne;
// [2, 4, 6, 8, 10, 12, 14, 16, 18]
numListOne.reverse();
// [18, 16, 14, 12, 10, 8, 6, 4, 2]

【6】sort

• 对数组元素排序

numListOne;
// [18, 16, 14, 12, 10, 8, 6, 4, 2]
numListOne.sort((a,b)=>a-b); // 自定义排序规则，升序排列
console.log(numListOne);
// [2, 4, 6, 8, 10, 12, 14, 16, 18]

【7】splice

• 插入、删除或替换数组元素

numListOne;
// [2, 4, 6, 8, 10, 12, 14, 16, 18]

numListOne.splice(2, 2, 'x', 'y'); // 从下标2开始，删除2个元素，并在此位置插入'x'和'y'
console.log(numListOne);
// [2, 4, 'x', 'y', 10, 12, 14, 16, 18]
// undefined
numListOne;
// [2, 4, 'x', 'y', 10, 12, 14, 16, 18]

【8】toString

• 数组转为字符串

numListOne;
// [2, 4, 'x', 'y', 10, 12, 14, 16, 18]

numListOne.toString();
// '2,4,x,y,10,12,14,16,18'

【9】valueOf

• 获取数组原始值

numListOne.valueOf();
// [2, 4, 'x', 'y', 10, 12, 14, 16, 18]

【10】indexOf

• 查找指定元素在数组中的位置

numListOne;
// [2, 4, 'x', 'y', 10, 12, 14, 16, 18]

numListOne.indexOf('y');
// 3

【11】lastIndexOf

• 查找指定元素在数组中最后一次出现的位置

let arr = ['a', 'b', 'c', 'a', 'b'];
let lastIndex = arr.lastIndexOf('a'); 
console.log(lastIndex);
// 3

【12】map

• 应用函数映射数组元素

numListTwo;
// [18, 16, 14, 12, 10, 8, 6, 4, 2]
let squaredNum=numListTwo.map(num=>num*num);
// undefined
console.log(squaredNum);
// [324, 256, 196, 144, 100, 64, 36, 16, 4]

【13】filter

• 根据条件筛选数组元素

let arr = [1,2,3,4,5];
let eventNumbers = arr.filter(num=>num%2 === 0 )
console.log(eventNumbers);
// [2, 4]

【14】every

• 判断数组所有元素是否都满足条件

let arr =[true,true,false];
let allTrue = arr.every(val=>val);
console.log(allTrue);
// false

【15】some

• 判断数组是否有元素满足条件

let arr =[true,true,false];
let allTrue = arr.some(val=>val);
console.log(allTrue);
// true

【16】reduce

• 按规则累积数组元素生成单个返回值

let arr = [1,2,3,4,5];
let sum =arr.reduce((total,num)=>total + num,0);
console.log(sum);
// 15

let arr = [1,2,3,4,5];
let sum =arr.reduce((total,num)=>total + num,2);
console.log(sum);
// 17

【17】rightReduce

• 从数组末尾开始累积

let arr = [1,2,3,4,5];
let reversedSum =arr.reduceRight((total,num)=>total + num,0);
console.log(reversedSum);
// 15

let arr = [1,2,3,4,5];
let reversedSum =arr.reduceRight((total,num)=>total + num,2);
console.log(reversedSum);
// 17

【18】统计数组长度

var arr= [11,22,33,44,55,66];
// undefined

arr
// [11, 22, 33, 44, 55, 66]

// （1）统计数组的个数
arr.length
// 6