十分钟掌握JavaScript核心语法

149 阅读2分钟

1. 定义变量,常量,打印

  • 使用let定义变量
  • 使用const定义常量,常量定义后不可修改
  • 使用console.log()在控制台打印.

2. 数据类型

  • 基本类型:number(整数,浮点数), boolean, String, null, undefined
  • 复杂类型:Array, Object, Function

3. 数学运算符

1 + 2;   // 3
1 - 2;   // -1
1 * 2;   // 2
1 / 2;   // 0.5
3 % 2;   // 1
++1;     // 2
--1;     // 0
2 ** 3;  // 8

4. 比较预算符

1 < 2;   // true
1 <= 2;  // true
1 > 2;   // false
1 >= 2;  // false
3 == '3';  // true, 先尝试类型转换
3 === '3'; // false, 严格比较,先匹配类型,再比较值

5. 逻辑运算符

true && false;   // false
true && false;   // true
!true;           // false

6. 分支语句

  • if() {} else {}
  • if() {} else if() {} else {}
  • switch(a) { case: 1: //处理操作 break; default: //处理操作 }
  • a > 10 ? '大于10' : '小于等于10' // 三目运算符

7. 循环语句

// for循环,使用 continue跳过本次,循环体继续 ; break终止循环体
for(let i = 0; i < 10; i++) {
    console.log(i);
}

// while循环
let j = 0;
while(j < 10) {
    console.log(j);
    j++;
}

// do while循环
let k = 0;
do {
    console.log(k);
    k++;
} while(k < 10)

8. 函数

  • 函数可以赋值给变量
  • 没有函数名称的函数叫匿名函数
  • es6中有箭头函数
function f(a,b) {
    return a + b;
}
f(1,2);  // 调用

// 箭头函数赋值
const f = (a,b) => a + b
f(1,2)

9. 数组

  • 基本用法
let arr = [2,3]       // 定义数组
arr[0] = 1            // [1,2,3] 赋值
arr.length            //  3  长度
arr.push(4)           // [1,2,3,4]   添加元素至数组末尾
arr.unshift(4)        // [4,1,2,3]   添加元素至数组头部
let arr2 = arr.pop()  // arr: [1,2]  arr2: 3   移除末尾元素
let arr2 = arr.shift()  // arr: [2,3]  arr2: 1   移除头部元素
  • 常用api
let arr = [1,2,3]

// forEach  循环数组 e: 当前元素, i:当前索引, arr:数组本身
arr.forEach((e, i, arr) => {
    console.log(e)
})

// map 返回同等长度的新数组
let arr2 = arr.map( e => e + 1)
console.log(arr2)  // [2,3,4]

// filter 过滤数组
let arr2 = arr.filter( e => e > 2)
console.log(arr2)  // [3]

// 使用for of 遍历数组
for(let e of arr) {
    console.log(e)
}

10. 对象

//  定义对象
let obj = {
    a: 1,
    b: true,
    f: ()=>{
    },
    arr: [],
    obj: {}
}

// 取对象的值:
obj.a        // 1
obj['a']     // 1

// 循环对象 o为对象的属性名
for(let o in obj){
    console.log(o,obj[o])
}

11. JS中内置的对象和函数

  • Math
Math.sqrt(4);         // 2
Math.max(1,2,3,4);    // 4
Math.min(1,2,3,4);    // 1
Math.PI;              // 3.1415926
  • Date
let date = new Date();   //当前日期
date.getFullYear()       // 2022
date.getMonth()       // 12
date.getDate()       // 10
date.getTime()       // 时间戳
  • parseInt, parseFloat
parseInt("1")       // 1
parseFloat("1.22")  // 1.22
  • setTineout(), setInterval(), clearTimeout(), clearInterval(),

12. 错误处理

try {
    // 处理逻辑
} catch(e) {
    // 捕获错误
}

13. 异步操作(Promise)

  • 这是个复杂的知识点.可以单独写一篇文章介绍