1. es6/es7

es6新特性：

let/const:

let定义变量，const定义常量

使用let声明的变量有块级作用域，且没有变量的声明提升，使用let声明的变量在声明之前调用会报语法错误

函数扩展：

函数参数默认值；函数的rest函数；箭头函数：箭头函数没有自己的this对象，内部的this就是定义时上层作用域的this。

箭头函数可以使函数内部的this指向和函数外部保持一致；

promise:

解决异步编程的一种方案，可以解决回调；

promise对象是一个构造函数，用来生成promise实例；

代码层面：promise提供了一个构造函数，在使用的时候必须通过new创建一个实例对象，在创建实例对象的时候必须要传一个匿名函数，这个函数有resolve,reject两个参数

resolve成功

reject失败

all:可以一次执行多个promise实例，返回数组。

race：一次执行多个promise实例，哪个实例最先执行完，就返回哪个执行结果。

注：promise对象状态不受外界环境影响，且状态一旦改变就不会再变，状态不可逆。

模板字符串：`${hello} world`

延展操作符：

let objClone = {...obj}

解构赋值：

let [a,b] = [1,2]; let {name,age} = {name: 'xxx',age:18}

模块化：

export导出

import导入

类：

class person {
    constructor(name,age) {
        
    }
    sayHello() {
        return 'hello' + this.name;
    }
}

使用extends关键字实现继承

class child extends person{}

es7新特性

数组新方法：

includes：返回布尔值，之前用的indexOf来判断是否存在某元素

指数运算符**：等效于Math.pow();

console.log(2**10);//1024

es8新特性：

async/await:

async用来修饰函数的声明，使用async修饰的函数会变成一个异步函数；

await用来修饰函数的调用，被await修饰的函数必须返回一个promise异步对象；

Object.values():

返回object属性的所有值，可用来遍历对象

Object.entries();

返回一个对象自身可枚举属性的键值对数组

String.prototype.padStart/String.prototype.padEnd

给空字符串添加开头或结尾

2. uniapp

a. rpx,px,em,rem,%,vh,vm区别：

rpx:相当于把屏幕宽度分为750份，1份就是1px；
px：绝对单位，页面按精确像素展示；
em：相对单位，相对于它的父节点字体进行计算；
rem：相对单位，相对根节点html的字体大小来计算；
%：相对于父元素；
vh：视窗高度，1vh等于视窗高度的1%;
vm:视窗宽度，1vm等于视窗宽度的1%；

b. 上传文件常用api

uni.uploadFile({
    url: '',
    fileType: 'image',
    filePath: '',
    name: '',
    success: function(){}
})

uni.chooseFile({
    count: '',
    extension: ['.zip','.doc'],
    success: function(){}
})

uni.chooseFile({
    count: '',
    type: 'image',
    success: function(){}
})

c. uniapp的配置文件,入口文件，主组件，页面管理部分

uniClound:云空间目录
components：组件
hybrid: App端存放本地html文件的目录
platforms 存放各平台专用页面的目录
pages: 业务页面文件存放的目录
static:存放应用引用的本地静态资源
uni_modules：存放uni_modules规范的插件
wxcomponents：存放小程序组件的目录
main.js：vue初始化入口文件
App.vue：应用配置，用来配置App全局样式以及监听应用声明周期
manifest.json：配置应用名称，appid,logo，版本等打包信息
pages.json:配置页面路由，导航条，选项卡等页面类信息
uni.scss:uni-app内置的常用样式变量。

d.组件生命周期

beforeCreate
created
beforeMount
mounted
beforUpdate
updated
beforeDestroy
destroyed

e.路由与页面跳转

uni.navigoteTo
uni.redirectTo
uni.switchTab
uni.reLaunch
uni.navigateBack
exit:退出小程序，target="miniProgram"时生效

f. websocket

let socketTask = uni.connectSocket({})

socketTask.onMessage():监听websocket接受到服务器的消息事件
socketTask.send():通过websocket连接发送数据
socketTask.close():关闭websocket连接
socketTask.onOpen():监听websocket连接打开事件
socketTask.onClose():监听websocket连接关闭事件
socketTask.onError()：监听websocket错误事件

3. 小程序

小程序的生命周期分为三部分：

应用的生命周期

onLaunch
onShow
onHide
onError
onPageNotFound
onUnhandleReection
onThemeChage

页面的生命周期

onLoad
onShow
onReady
onHide
onUnload

组件的生命周期

created
attached
ready
moved
detached
error

小程序路由跳转方式

navigateTo:保留当前页面，跳转到应用内的某个页面，使用wx.navigateBack可以返回到原页
redirectTo:关闭当前页面，跳转到应用内的某个页面
switchTab:跳转到tabBar页面，同时关闭其他非tabBar页面
navigateBack:返回上一个页面
reLanch:关闭所有页面，打开到应用内的某个页面

提高小程序的应用速度方法

小程序启动加载性能：
- 控制代码包的大小
- 分包加载
- 首屏体验（预请求，利用缓存，避免白屏，及时反馈）
小程序渲染性能：
- 避免不当的使用setData
- 使用自定义组件

小程序的登录流程

通过wx.login()获取到用户的code判断用户是否授权读取用户信息，调用wx.getUserInfo读取用户数据
通过wx.request()请求服务器，后端把appid,appsecret和code一起发送给微信服务器。
微信服务器返回了 openid 及本次登录的会话密钥 session_key
后端从数据库中查找 openid ，如果没有查到记录，说明该用户没有注册，如果有记录，则继续往下走
session_key 是对用户数据进行加密签名的密钥。为了自身应用安全，session_key 不应该在网络上传输
然后生成 session并返回给小程序，小程序把 session 存到 storage 里面
下次请求时，先从 storage 里面读取，然后带给服务端
服务端对比 session 对应的记录，然后校验有效期

小程序的发布流程

上传代码
提交审核
发布版本

小程序的支付流程

1.进入小程序，点击支付
2.wx.login获取用户临时登录凭证code，发送到后端服务器换取openId
3.在下单时，小程序需要将购买的商品Id，商品数量，以及用户的openId传送到服务器
4.服务器在接收到商品Id、商品数量、openId后，生成服务期订单数据，同时经过一定的签名算法，向微信支付发送请求，获取预付单信息(prepay_id)，同时将获取的数据再次进行相应规则的签名，向小程序端响应必要的信息
5.小程序端在获取对应的参数后，调用wx.requestPayment()发起微信支付，唤醒支付工作台，进行支付
6.接下来的一些列操作都是由用户来操作的包括了微信支付密码，指纹等验证，确认支付之后执行鉴权调起支付
7.鉴权调起支付：在微信后台进行鉴权，微信后台直接返回给前端支付的结果，前端收到返回数据后对支付结果进行展示
8.推送支付结果：微信后台在给前端返回支付的结果后，也会向后台也返回一个支付结果，后台通过这个支付结果来更新订单的状态

小程序的实现原理

小程序中，选择了 Hybrid 的渲染方式，将视图层和逻辑层是分开的，双线程同时运行，视图层的界面使用 WebView 进行渲染，逻辑层运行在 JSCore 中。

小程序在渲染层，宿主环境会把wxml转化成对应的JS对象，在逻辑层发生数据变更的时候，通过宿主环境提供的setData方法把数据从逻辑层传递到渲染层，再经过对比前后差异，把差异应用在原来的Dom树上，渲染出正确的视图

小程序分包

小程序分包如何进行工作的：在小程序启动时，默认会下载主包并启动主包内页面，当用户进入分包内某个页面时，客户端会把对应分包下载下来，下载完成后再进行展示。对小程序进行分包,可以优化小程序首次启动的下载时间,以及在多团队共同开发时可以更好的解耦协作。在 subpackages 里面进行配置分包。（app.json/pages.json【这个是uni-app】文件中）微信小程序对于大小方面的相关限制：

1.不限制分包的数量；
2.所有分包的大小不能超过20M；
3.单个包的大小不能超过2M；

4. typescript

数据类型

boolean:布尔类型
number：数字类型
string:字符串类型
array:数组类型
tuple：元组类型
enum：枚举类型
any：任意类型
null和undefined类型
void类型(ts)
never类型(ts)
objct：对象类型（ts）

ts中的枚举类型

例：

enum Days {
    Sun,//没有赋值默认从0开始
    Mon,
    Tue,
    Wed,
    Thu,
    Fri,
    Sat
}

`ts`的接口

接口所描述的时一个对象相关的属性和方法

例如：

interface interface_name {}
interface User {
    name: string,
    age?: number, //?表示可选
    readonly hobby: array
}
const getUserInfo = (user: User):string => {
    return `name: $(user.name),age:$(user.age)`
}
getUserInfo({name:'tony',age:18,hobby:['sing']})

`ts`中的类如何理解？

class class_name {
    //字段：类里边声明的变量
    name: string
    constructor(name:string){
        this.name = name
    }
    //方法：为对象要执行的操作
    sayHello():void{
        console.log('hello,'+this.name)
    }
}

extends:继承

类继承后，子类可以对父类的方法重新定义，这个过程称为方法的重写。通过super对弗雷直接引用，该关键字可以引用弗雷的属性和方法。

修饰符：

public公共
private私有
protect受保护(子类可以访问)
readonly只读修饰符
static静态属性

ts中函数

ts声明函数需要定义参数类型或者声明返回值类型

ts在参数中，添加可选参数?操作符

ts增加了函数的重载功能

ts中泛型

泛型通过<>的形式进行表述，可以声明函数,接口，类

例：

function fun<T>(param:T):T{
    return param
}

ts模块

export关键字导出变量或者类型，用法与es6模块一样

export const a = 'xxx'

import 引入模块

import {a} from './index.js'

笔记