1. 安装1npm install webpack webpack-cli -D webpack-cli 不是必须的，是用来加载 webpack.config.js 的配置文件，你完全可以自己创建一个 cli 来加载，例如 vue 使用的就是 vue-cli 2. 配置浏览器兼容性2.1 默认配置如果不配置 Browserslist 那么就会使用默认的配置( > 0.5%, last 2 versions, Firefox ESR, not dead ) > 0.5% 为浏览器的市场占有率大于 0.5%,在https://caniuse.com/usage-table可以查询 last 2 versions 为每个浏览器的最后 2 个版本 not dead 为 24 个月内官方支持更新的浏览器 2.2 手动配置1.在 package.json 配置 12345"browserslistrc": [ ">1%", "last 2 version", "not dead"] 2.在.b ...

初始化1npm init -y 安装 koa1npm install koa 划分目录结构安装路由1npm install koa-router 安装 koa-bodyparser1npm install koa-bodyparser 安装 jsonwebtoken 进行登录鉴权1npm install jsonwebtoken 安装 mysql2 连接数据库1npm install mysql2 123456789101112131415161718192021const mysql = require("mysql2");const connections = mysql.createPool({ host: "127.0.0.1", port: "3306", database: "property", user: "root", password: "xxbsxy",});connections.getConnecti ...

koa 初体验1234567891011121314const Koa = require("koa");const app = new Koa();// use注册中间件app.use((ctx, next) => { // ctx为上下文 里面有response和request对象 // 向客户端返回数据 相当于express的res.send ctx.response.body = "Hello Koa";});app.listen(3000, () => { console.log("服务启动成功");}); koa 中间件和 express 不同，koa 注册中间件只能通过 use 方法 Koa 并没有提供 methods 的方式来注册中间件 也没有提供 path 中间件来匹配路径 不能在一个 use 方法连续注册多个中间件 但是在 koa 的第三方路由中可以连续注册多个中间件 koa 路由的使用1npm install koa-router ...

express 初体验12345678910111213141516171819const express = require("express");// express是一个函数 返回一个appconst app = express();// 监听默认路径app.get("/", (req, res, next) => { // send方法接收两个参数,第一个是状态码 第二个是响应参数 res.send(200, "Hello Express");});// 监听post请求app.post("/", (req, res, next) => { res.send("Hello Express");});// 开启监听app.listen(3000, () => { console.log("服务启动成功");}); express 中间件中间件是什么呢？中间件的本质是传递给 e ...

http 初体验123456789101112const http = require("http");const server = http.createServer((req, res) => { res.end("Hello Server"); // 相当于先调用 write方法然后调用end方法});// 启动服务器并指定端口号和主机// listen方法接收三个参数 第一个是端口号,不传为随机端口,第二个为主机地址默认为0.0.0.0,// 第三个为服务器启动成功的回调server.listen(3000, "0.0.0.0", () => { console.log("服务启动成功");}); 创建 http 服务的不同方式12345678910111213141516171819202122232425const http = require("http");// 方式一const server1 = http.cr ...

ES3 中的执行上下文ES3 中的执行上下文类型全局执行上下文这是默认或者说是最基础的执行上下文，一个程序中只会存在一个全局上下文，它在整个 javascrit`脚本的生命周期内都会存在于执行堆栈的最底部不会被栈弹出销毁。全局上下文会生成一个全局对象（以浏览器环境为例，这个全局对象是 window） 全局对象是预定义的对象，作为 JavaScript 的全局函数和全局属性的占位符。通过使用全局对象，可以访问所有其他所有预定义的对象、函数和属性。 在顶层 JavaScript 代码中，可以用关键字 this 引用全局对象。因为全局对象是作用域链的头，这意味着所有非限定性的变量和函数名都会作为该对象的属性来查询。 例如，当 JavaScript 代码引用 parseInt() 函数时，它引用的是全局对象的 parseInt 属性。全局对象是作用域链的头，还意味着在顶层 JavaScript 代码中声明的所有变量都将成为全局对象的属性。 函数执行上下文在函数上下文中，我们用活动对象(activation object, AO)来表示变量对象。 活动对象和变量对象其实是一个东西，只是变 ...

1. promise 的基本使用1234567891011121314151617181920212223242526272829303132// Promise传入一个回调函数接收两个参数，第一个参数是成功的回调，第二个是失败的回调// Promise对象有三种状态pending(进行中)、fulfilled（已成功）和rejected（已失败）状态// Promise刚开始是pending(进行中)状态，调用resolve则从pending变为fulfilled// 调用reject从pending变为rejected。只要这两种情况发生，状态就凝固了，不会再变了const p = new Promise((resolve, reject) => { // pending console.log("111"); console.log("222"); // fulfilled resolve("成功的回调");});const p1 = new Promise((resolve, rej ...

函数柯里化1234567891011121314function curry(fn) { function curried(...arg) { // 判断传入的参数是否大于等于函数需要的参数 大于等于则直接执行函数 if (arg.length >= fn.length) { return fn.apply(this, arg); } else { // 小于则继续递归执行curried函数,直到满足条件 return function (..._arg) { return curried.apply(this, [...arg, ..._arg]); }; } } return curried;}

1. 防抖函数1234567891011121314151617181920212223242526272829//防抖函数让某个触发事件在n秒内只会被执行一次function debounce(fn, delay, immediate = false) { // 记录定时器 let timer = null; // 记录immediate的值 let flag = immediate; // 不能返回箭头函数,this会指向window return function (...arg) { // 如果上一次setTimeout还没结束则直接取消 if (timer) { clearTimeout(timer); } // 如果immediate为true则一开始就执行一次 if (immediate && flag) { fn.apply(this, arg); flag = false; } // 定时器延迟执行函数 ...