基础知识 HTTP 浏览器向服务器发送 HTTP 请求（请求报文） 服务器接收到请求后，处理请求，向浏览器返回 HTTP 响应（响应报文） 浏览器端接收到响应，解析 显示响应体 或 调用回调函数 浏览器控制台显示方式不是按照报文格式显示 请求报文（请求） 请求行： 格式：method url 例如：GET / product_detail?id=2 请求头（多个） Host：www.baidu.com Cookie：xxxxxxx Content-Type：xxxxxxxx 请求体 GET 请求没有请求体 POST：{“username”:”tom”, “pwd”:123} 响应报文（响应） 响应行 格式：status statusText 例如：200 OK 或 404 Not Found 响应头（多个） Content-Type:xxxxxxx Set-Cookie:xxxxxxxx 响应体 多种文件/数据格式 HTTP 请求和 ajax 请求 ajax 请求是特殊的 HTTP 请求 对服务器来说，没 ...

基础知识函数对象、实例对象 函数对象 将函数作为对象使用时，简称为函数对象 实例对象 new 构造函数或类产生的对象，称为实例对象 回调函数 作为参数传递的函数 函数定义了，但没有主动调用，最终却执行的函数 回调函数分类 同步的回调函数 立即在主线程上执行，不会放入 回调队列 中 例子：数组遍历相关的回调函数 异步的回调函数 不会立即执行，会放入 回调队列 中以后执行 例子：定时器回调 / ajax 回调 错误和处理 错误类型 Error：所有错误的父类型 ReferenceError：引用变量不存在 TypeError：数据类型不正确 RangeError：数据值不在其所允许的范围内-死循环 SyntaxError：语法错误 错误处理 捕获错误：try{…}catch(){…} 抛出错误：throw new Error(“错误描述”) 错误信息 message属性：错误相关信息 stack属性：记录信息 Promise 理解promise 抽象表达 Promise 是 JS 中进行异步编程的新方案。旧方案-纯粹的回调 ...

简介 工具 whistle文档 SwitchyOmega 插件 （ 谷歌 ） （ Edge ） 功能介绍 【whistle】：基于Node实现的跨平台web调试 代理工具、抓包工具，类似的工具有Windows平台上的Fiddler 支持作为 HTTP、HTTPS、SOCKS 代理及反向代理 支持抓包及修改 HTTP、HTTPS、HTTP2、WebSocket、TCP 请求 支持重放及构造 HTTP、HTTPS、HTTP2、WebSocket、TCP 请求（发送一个目的主机已接收过的包） 支持设置上游代理、PAC 脚本、Hosts、延迟（限速）请求响应等 支持查看远程页面的 console 日志及 DOM 节点 支持用 Node 开发插件扩展功能，也可以作为独立 npm 包引用 【SwitchyOmega】：用于进行 代理配置 （将请求通过指定代理服务器进行发送） 使用场景 在此主要用于 跨域web调试 在本地开发中，需要用测试环境或正式环境域名访问本地项目而不是使用ip端口方式访问，可以通过 whistle 进行代理，配置规则后通过域名访问本地项目，从而实现可以 ...

什么是 webpack模块打包器 == 构建工具 将程序员写完的 源代码 ，加工成浏览器可以：高效、稳定运行的，兼容性较好的代码 webpack 中会将前端的所有资源文件（js/json/css/img/less/…）都作为模块处理 webpack 根据模块的依赖关系进行分析，生成对应的资源 webpack 原理 五个核心概念 【入口（enter）】 指示 webpack 应该使用哪个模块，来作为构建其内部依赖图的开始 【输出（output）】 在哪里输出文件，以及如何命名这些文件 【Loader】 处理那些非 JavaScript 文件（webpack 自身只能解析 JavaScript和json） 【插件（plugins）】 执行范围更广的任务，从打包到优化都可以实现 【模式（mode）】 有生产模式 production 和 开发模式 development loader 的理解 webpack 本身只能处理 JS、JSON 模块，如果要加载其他类型文件（模块），需要使用对 ...

什么是包管理器 是跨平台运行环境 node.js 中，用来管理包的一个工具，简称 npm 安装 node.js 运行环境，将自动安装 npm 包管理 node.js 官网：https://nodejs.org/zh-cn/ 什么是包是依据包规范，使用模块实现的代码集合 即：具有特定文件，和特定结构的，文件夹 包的内容 package.json 描述文件（包的“说明书”，必须要有） bin 可执行的二进制文件 lib 经过编译的js代码 doc 文档（说明文档，bug修复文档，版本变更记录文档） test 测试报告 package-lock.json 当安装了一个包，会生成一个 package-lock.json 文件（npm6 及以后才有），里面保存的每个下载过的包的地址，使下次下载速度更快 package.json "scripts":{...} 配置项 说明 解释 作用 scripts 配置项，是用来给常用命令定义别名的 配置 "scripts":{ peiqi ...

原生ajax 优点 页面无需刷新与服务器进行通讯获取数据 缺点 没有浏览历史，不能回退 存在跨域问题 SEO不友好，不能进行SEO优化 基本实现 创建xhr实例 const xhr = new XMLHttpRequest() 配置发送请求方式、url xhr.open('get','http://127.0.0.1:8080/xxx') 发送请求 xhr.send() 请求传参 ajax 有两种请求方式，get/post ，不同请求方式发送的参数格式也不同 GET query 参数 参数以 urlencoded 编码格式进行声明 ?name=老刘&age=18 xhr.open('get','http://127.0.0.1:8080/xxx?name=老刘&age=18') params 参数 参数以 路由 方式进行声明，服务端使用规则进行解析数据 /老刘/18 xhr.open('get','http://127.0.0.1:808 ...

理解模块化 什么是模块 将一个复杂的程序 拆分 成单个文件，最终 组合 在一起 拆分的 文件 就是模块，模块内部数据是私有，只是向外部暴露一些方法与其他模块通信 模块、库、包 的区别模块（Module）： javascript文件库（Library）：使用模块实现的一些 功能的统称，概念性的称呼（jQuery库，就是用于实现DOM操作）包（Package）：是依据包规范，对库功能实现的代码集合 为什么要模块化 降低复杂度，提高解耦性 避免命名冲突 更高的分离，按需加载 更高复用性，高可维护性 模块化带来的问题 请求过多 需要引入过多的文件 依赖模糊 引入文件的顺序不明确（依赖） 难以维护 模块化规范 应用范围 CommonJS node：可以写服务端模块化代码 browser：可以写浏览器端模块化代码 ES6 browser：只能写浏览器端模块化代码 模块的特性 引入模块时，接收的暴露数据是常量 多个模块组合在一起，相当于组合成一个JS文件 同一个组合中，对某一个模块的不同引用，获取的是同一个数据（不同组合对同一模块的引用各自独立） 引入模块语句，会被提 ...

1.let关键字 作用: 与var类似, 用于声明一个变量。 特点: 在块作用域内有效。 不能重复声明。 不会预处理, 不存在变量提升。 应用: 循环遍历加监听。 使用let取代var是趋势1。 123456789101112console.log(age);// 报错：age is not definedlet age = 12;let age = 13;//报错：Identifier 'age' has already been declaredconsole.log(age);//let可以解决"循环遍历加监听"问题，此处如果用var定义i，alert全部为2//加入我页面中有三个<button>let btns = document.getElementsByTagName('button');for(let i = 0;i<btns.length;i++){ btns[i].onclick = function () { aler ...

控制台总提示开发版 Vue.js 问题 控制台有提示： You are running Vue in development mode.Make sure to turn on production mode when deploying for production.See more tips at https://vuejs.org/guide/deployment.html 解决 <script>标签中输入代码1Vue.config.productionTip = false 注册的组件未使用，页面总是报错 问题 组件中注册了需要引入的组件，但是引入的组件在页面中还没有使用，因此总是报错 解决 修改项目的 package.json eslintConfig 配置项 rules 配置项12345"eslintConfig": { "rules": { "vue/no-unused-components": "off" //修改规则
...

Vue简介 框架类型 动态构建用户界面的 渐进式JavaScript 框架 使用模式 遵循 MVVM模式 与其他JS框架特点 借鉴 Angular 的 模板 和 数据绑定 技术 借鉴 React 的 组件化 和 虚拟DOM 技术 基础语法 安装 <script>引入 本地引入 CDN加速网络引入 npm引入 npm install vue 语法前提 使用Vue语法前需要满足的条件和需要了解的知识点 Vue容器 & Vue实例 创建 Vue容器 12345<body> <div id="root"> Vue容器 </div></body> 创建 Vue实例 12345<script> const v = new Vue({ el:"#root" //el用于指定当前Vue实例为哪个容器服务，通常值为css选择器字符串 })</script> 工作流程 ...