javascript基础课堂二

流程控制

1. 单分支 if

   当条件为 true 时才执行 if 里面的代码

   例：
   • let age = 19;
   if(age > 18){
   console.log("你成年了");
   • }

2. 双分支 if else

   例：
   • let age = 17;
   if(age > 18){ //如果age大于18
   console.log("你成年了");
   • }else{ //否则
   console.log("你还是个小孩");
   }

3. 多分支

   if (条件1) { //如果为true执行 为false执行条件2
   ​
   •   } else if (条件2) { //如果为true执行 为false执行条件n
   ​
   } else if (条件 n) { //如果为true执行 为false执行条件else
   ​
   }else { //所有条件都不满足执行
   ​
   •   }

4. 作用域

   全局作用域：声明变量为全局且不包含在任何语句里

   局部作用域：声明变量在语句里就是局部作用域 语句嵌套子级可以使用父级的局部声明变量

   注：

   有局部变量就用局部变量，若没有就向父级和全局寻找、直到找到为止，否则报错。

   变量名可以在不同的作用域使用

5. switch

   等价于多分支。代码清晰、执行效率高于 if else if...

   switch () {

   case A:

   break;

   case B:

   break;

   ...

   default: //默认

   break; //跳出

   }

   case 匹配进行的全等匹配

循环

同一个代码块，需要执行多次，考虑用循环

1. for:

   测试前语句

   for( 初始化; 测试；递增递减 ) {

   循环体

   }

   for( 表达式1；表达式2；表达式3 ) {

   表达式4

   }

   执行步骤：1-2-4-3 2-4-3 2-4-3 2-4-3......

   例：
   for(i=0;i<=10;i++){
   console log("i") 1 2 3 4 5 6 7 8 9 10
   }

2. while：

   while(条件){ 代码块 }

   功能：条件为真则执行括号里面的代码，直到条件为假结束

   注：条件可以变化的、防止死循环

   let   i = 0
   • while ( i < 3 ){
   • 循环体；
   • i + +；
   • }
   ​
   • 例：let number = 1;
   • while(number<5){
   • number++;
   • }
   • console.log(number) //5

3. do while:

   后测试语句

   do{代码}whlie(条件)

   注：至少执行一次代码块，条件为真执行第二次、直到为假结束循环

   do {
   循环体；
   } while (测试语句);
   ​
   例：let number = 1;
   do {
   number++;
   } while (false);
   console.log(number) //2

数组

基本：number null undefined string boolean symbol

复杂：object

数据结构：计算机存储、组织数据的一种方式。

数组：把数据有序的集合在一起。数组中每一个值叫做 item 元素，每个元素在数组中都有唯一的位置，位置用数字表示叫做下标 || 索引 index

创建数组

1. 字面量：let arr = []
2. 构造函数： let arr = new Array()

typeof arr // object

数组赋值:

1.arr[index] = value arr[0] = "zhangsan";

1. arr[item1, item2, ...]

数组的长度： arr.length

查看（访问）数组元素:

arr[index]

数组中的每个值、都会有对应的一个下标（索引）、可以通过它获取对应数组 的值、下标起始值为0。

构造函数声明：let F70 = new Array();

字面量与构造函数的区别：

字面量的解析比构造函数快

原因：

字面量属于JSON格式、可以直接被JS解析

构造函数需要先调用构造函数、在进行JS解析

解构 es6:

将复杂数据类型的值拆解成简单数据类型。保持 = 左右两边数据结构相同。

例：

let arr = [1,2,3]
let [a,b,c] = arr
console.log(a,b,c) //1,2,3

let arr = [1,2,3]
let [a, ,c] = arr
console.log(a,b,c) //1,3
不需要的值，直接跳过

遍历数组：

1. for

 例：  
 let arr = [1, 2, 3, 4, 5]  
 for (let i = 0; i < arr.length; i++) {  
 console.log(arr[i]);//1,2,3,4,5  
 }  

1. es6 for of

例：  
 let arr=[1,2,3,4,5]  
 for(let item of arr){  
 console.log(item);//1,2,3,4,5  
 }  

1. for in 用在遍历对象 可以遍历下标

 例：let arr=[1,2,3,4,5]  
 for(let index in arr){  
 console.log(index);//0,1,2,3,4,  
 }  
   

1. forEach(callback 函数回调) 不能打断

例如：let arr=[1,2,3,4,5]  
 arr.forEach(function(item,index)){  
 console.log(`第${imdex}位的${item}`)  
 }

常量扩展：

如果赋值给常量的是基本数据类型、则常量存储该基本数据类型变量具体的值。

如果赋值给常量的是引用数据类型、则常量存储该引用数据类型变量的地址。

注：引用数据类型存储的值发生变化、常量存储该引用数据类型变量的地址里面的值不会变化。

多维数组：

let arr = [ [] ]

数组的操作方法:

1. push( )在数组末尾添加 1到多个值，返回添加后的数组长度

   例：let arr = [1,2,3]
   arr.push(1)//1,2,3,

2. pop( )删除末尾数组 返回删除的值
3. shift( )删除首位 返回删除的值
4. unshift( )在首位添加
5. Math.max()最大值
6. Math.min()最小值
7. slice( startindex, endindex )截取startindex到endindex-1之间的数组不包含自身、若参数为负则用数组长度与其相加、在若没有满足范围的值则返回空

   slice( startindex )从startindex开始全部截取

8. splice( startindex,deletecount,item 1,item2....)

   从第几个下标开始 删除几个 修改(替换 删除后才能替换和修改否则在第一个参数下标前新增)

   例如：
   let arr = [1, 2, 3, 4, 5];
   let arr1 = arr.splice(2, 2, 9, 1)  //从下标2开始 删除两个包括自身 并替换删除的第一个为9 第二个为1
   console.log(arr1);  // 返回被删除的数 3 4
   console.log(arr);  //1 2 9 1 5
   ​
   ​
   let arr = [1, 2, 3, 4, 5];
   let arr1 = arr.splice(2, 0, 9, 1)  //从下标2开始 没有删除 在下标2之前插入(新增) 9 1
   console.log(arr1);  // 返回被删除的数 [ ]
   console.log(arr);  //1 2 9 1 3 4 5

9. arr.reverse( )翻转数组前后顺序
10. arr.sort( )排序

    例： arr.sort( (a,b)=>a-b)升序
    arr.sort( (a,b)=>b-a)降序

11. arr.concat( )

    例：
    let arr2 = [1,2,3]
    let arr1 = [4,5,6]
    let arr3= arr.concat(arr2,arr1)  //[1,2,3,4,5,6]

12. arr.indexof( )查找下标 arr.lastindexof( )从后往前

    例：let arr = [1,2,3,4,5,6]
    console.log(arr.indexof('1')) //[0]
    如果下标不存在打印-1
    ​
    ​
    let arr = [1,2,NaN,4,5,6]
    console.log(arr.indexof(NaN)) // -1
    console.log(arr.lastindexof(NaN)) // -1
    console.log(arr.includes(NaN)) //true

13. str.split("分隔符")并且不包含 字符串转数组该分隔符

    例：let str = "t a n g k e c h a o"
    let strs = str.split("a")
    consloe.log(strs) // ["t" ngkech "o"]
    当str.split("-")时
    consloe.log(strs) //[ 't' ,'a', 'n', 'g', 'k' ,'e' ,'c', 'a' ,'o']
    当str.split("")时
    consloe.log(strs) //[ 't a n g k e c a o']
    ​
    例：
    let str = "123";
    let arr = [];
    arr = [...str];
    console.log(arr) //[1,2,3]

14. arr.join( 分隔符 ) 数组转字符串

    例：let arr = [1,2,3,1]
    let arrs = arr.join("-")
    console.log(arrs)//1-2-3-1
    ​
    let arr = [1,2,3,1]
    let arrs = arr.join(",")
    console.log(arrs)//1,2,3,1
    ​
    let arr = [1,2,3,1]
    let arrs = arr.join(" ")
    console.log(arrs)//1 2 3 1

15. 查找arr.includes(value) 返回boolean值

    例：let arr= [1,2,3,4]
    console.log(arr.includes("1")) //true
    console.log(arr.includes("5")) //false

16. arr.map( function( ) ){......}

    遍历同时操作，返回新数组，老数组不变

    例：let arr = [1,2,3]
    let arrs=arr.map(function ( item ) ){
    return item*2
    }
    console.log(arr) //[1,2,3]
    console.log(arrs) //[2,4,6]

17. 过滤 arr.filter( function ( ) ){.....}

    返回条件为true的item

    例：let arr = [1,2,3,4]
    let arrs = arr.filter(function (item) ){
    return item%2=0; //返回值
    }
    console.log(arr) //[1,2,3,4 ]
    console.log(arrs) //[2,4 ] //调用
    不会留下undefined

18. 面试题

    let arr = [0,1,2] //[0,1,2,undefined,undefined,5]
    ​
    arr[5] = 5 //新增下标：[undefined] [undefined] [5]
    ​
    let arrs = arr.filter(function ( item) ){
    ​
    return item = = undefined; //当item 也就是下标 = = undefined
    ​
    });
    ​
    console.log(arrs) //[ ] [ ]

19. arr.some( ) arr.every( ) 返回boolean值

    let arr = [1,2]
    ​
    let arrs = arr.every(function( item ){
    ​
    return  item%2 ==0;
    ​
    })
    ​
    console.log(arrs) //false
    ​
    如果把every换成some //true

20. 扩展运算符 . . .

    let arr = [ 1,2,3]
    ​
    let arr1 = [ 3,2,1]
    ​
    let arr2 = [ ...arr...arr1]
    ​
    console.log(arr2)  //[1,2,3,3,2,1]

21. ES6 新增数据结构 Set 集合

    一，去重

    1. .size array .length set .size
    2. s.add(value) 不会包含重复的值，不做数据类型转换
    3. 链式调用
    4. set 转 array

二，Map 映射

1.  `区别 arr.map()`
    
2.  let m = new Map() 与对象相似，键可以是任意数据类型
    
    let s = new Set(arr);  
    ​  
    s.add(4);  
    ​  
    s.add(4);  
    ​  
    s.add(4);  
    ​  
    s.add("4");
    

三，链式调用

s.add(4).add(4).add(4).add("4");  
​  
​  
​  
arr = [...s];  
​  
console.log(arr);  
​  
​  
​  
console.log(s);  
​  
let tempArr = [];  
​  
for (let item of s) {  
​  
```  
tempArr.push(item);  
```  
​  
}  
​  
console.log(tempArr

---

如有异议请联系我

---