--- JavaScript 的一些常用语法总结 ---

• JavaScript

  • 变量和常量

    • let修饰变量

    • const修饰常量

  • 模板字符串

    • 使用＇＇定义字符串，可以在符号中使用${}来表示需要动态添加的元素，还可以使用lambda表达式

  • 对象

    • 使用｛｝来定义对象，字段用k v表示，key：value，如果value为变量，那么可以省略key

    • 值的获取，obj.key 或者 objkey 获取，如果key是一个变量，那么只能使用objkey来获取 比如x＝key 可以objx 但是不能obj.x

  • 解构赋值

    • 对数组，使用xx，xx来对数组进行复制，方括号中的元素和数组中元素位置一一对应

      • let arr = 5，6，7 a，b，c = arr 也可以 ，a，b = arr 还可以a，...b = arr 这样a取剩下的元素就全给b了

    • 对对象，使用{}来对对象进行结构赋值

      • let obj = { name = "hhh"，age = 18} 在获取其元素 {name，age} = obj， 完整写法是{name：name1，age：age1} = obj 从obj中去到name赋给name1 也可以使用...来讲剩下的元素合并复制了 {name，...age1} = obj

  • 箭头函数

    • 使用（）=> {} 来表示一个函数表达式，（a，b）=> ｛ return a - b｝ 如果返回值只有一行的话 可以省略{}，同时return也要省略， （a，b）=> a - b， 如果只有一个人参数，小括号也能省略 a => a * 2

  • 数组的重要方法

    • 遍历foreach

      • foreach （item，index，array）{ item 当前遍历到的元素 index 当前元素下标 array 数组 }

    • 过滤filter

      • filter（a，b）=> ｛ return true ：false｝ 如果是false就过滤这个元素

    • 映射 map 在原来数组的基础上创建一个新的数组，这个新的数组元素可以和旧数组元素一一映射上

      • map（（item，index，array）=>{return xx}）这个xx就代表了返回的数组映射的元素

    • 尾插 push

    • 头插 unshift

    • 尾删 poll

    • 头删 shift

    • 任意位置的删除splice

      • splice（index，delcount，additem，additem，...）在index这个位置开始，删除delcount个元素，之后的是在这个位置添加元素

    • 检查元素是否存在 includes

    • 检测数据中的所有元素是否满足要求 every

      • every（（item，index，array）=> ｛ return Boolean｝）如果是false说明有一个元素不符合要求，于是方法退出并返回false

    • reduce 汇总 计算整个数组元素

      • reduce（（prev，item，index，array）=>{}，prev），第一个是一个函数表达式，在这个函数表达式中就可以进行一些对数组参数的计算，他的返回值会给到prev这个参数，最后reduce就返回的是prev这个参数

  • 类的重要方法

    • 对象的key keys

      • Object.keys(obj) 放回的是对象的所有key

  • 扩张运算符

    • 语法 ...

      • 复制合并数组

        • arr = ...arr1 复制数组 合并数组 arr = ...arr1, ...arr2

      • 复制合并对象

        • obj = {...obj1} 复制一个obj1 obj= {...obj1, ...obj2} 和并obj1 obj2的k v 对于相同的key obj2会覆盖obj1

  • 序列化和反序列化

    • 序列化JSON.stringify 反序列化JSON.parse

  • web 储存

    • localStorage 本地储存不会过期 只有js自己删除或者是清除本地缓存 sessionStorage 会话储存在浏览器未关闭之前不会过期，页面的关闭和恢复都还会有效

      • 储存 localStorage.setItem(key, value) 删 localStorage.removeItem(key) 查 localStorage.getItem(key)

  • 解决回调地狱

    • promise

      • 通过将异步代码封装，简化调用

        • let po = new Promise((resolve, reject)=>{ //Promise中的箭头函数由俩个参数 //resolve 表示异步代码执行成功 //reject 表示执行失败 }) // 返回一个对象，通过调用then来知道当前promise的执行状况 成功执 //行第一个回调函数 失败执行第二个 po.then(()=>{}, ()=>{})

    • await async

      • 通过在Promise类前面加上await修饰 他直接返回的是promise 的resolve函数的参数，那么就可以根据获取到的参数来决定执行逻辑了，然后await必须要在async修饰的方法中运行，async会让所有修饰了await的异步代码变为串行执行

        • async functon fn(n){ let po = await Promise((resolve)=>{setTimeout(()=>{ resolve(n); }, 1000)); console.log(po) let po1 = await Promise((resolve)=>{setTimeout(()=>{ resolve(n); }, 1000)}) console.log(po) }

  • 模块化

    • 对JavaScript的功能分模块，更加方便管理和开发

      • 使用npm init 初始化项目获取获取到一个package.json 的文件，创建index.js来作为代码的入口 使用 node .\index/js 来运行代码

        • 默认导入和导出 导出 export default fn(){} default只能有一个 导入 import xx form package.js 这个xx就对应了default字段修饰的元素

        • 按需导入和导出 导出 export fn(){} 导出 import {fn, xx} from package.js fn这些名字都是一一对应的