一，Fetch API 介绍
Fetch API提供了一个 JavaScript 接口，用于访问和操纵HTTP的请求和响应等。提供了一个全局 fetch()方法来跨网络异步获取资源。
fetch()是 XMLHttpRequest 的升级版，用于在 JavaScript 脚本里面发出 HTTP 请求。
二，基本用法：
fetch('https://test.com/api/info')
.then(response = response.json())
.then(json = console.log(json))
.catch(err = console.log('Reque
一、ASCII 码所有信息最终都是一个二进制值。每一个二进制位（bit）有0和1两种状态，因此八个二进制位就可以组合出256种状态，这被称为一个字节（byte）。「加ascii图」 二、ASCII 编码的缺点英语用128个符号编码就够了，但是用来表示其他语言，128个符号是不够的。一些欧洲国家就决定，利用字节中闲置的最高位编入新的符号。 比如，130在法语编码中代表了é，在希伯来语编码中却代表了字母Gimel (ג)，在俄语编码中又会代表另一个符号。但是不管怎样，所有这些编码方式中，0--127表示的符号是一样的，不一样的只是128--255的这一段。 至于亚洲国家的文字，使用的符号就更多了，
可选链操作符( ?. )允许读取位于连接对象链深处的属性的值，而不必明确验证链中的每个引用是否有效。?. 操作符的功能类似于 . 链式操作符，不同之处在于，在引用为空(nullish ) (null 或者 undefined) 的情况下不会引起错误，该表达式短路返回值是 undefined。与函数调用一起使用时，如果给定的函数不存在，则返回 undefined。之前：let nestedProp = obj.first && obj.first.second;
使用可选链操作符?.let nestedProp = obj.first?.second;
连用可选链操作符let
通常异常使用方式：try {
JSON.parse(json);
} catch (e) {
// TODO
}
但是这对于异步编程而言并不一定适应，下面的代码 catch 不会捕捉到异常，并导致程序退出：async function action(){
setTimeout(()= {
throw new Error("发生了错误");
}, 1000);
}
try {
action();
} catch (e){
console.log('catch: ', error.message);
}
异步I/O的实现主要包含两个阶段：提交请求和处理结果。这
本文为我的学习笔记，适合有 Vue.js 2.0 基础的人阅读。1，下载基础设置克隆Vue-next-Webpack-preview项目，它将为我们提供包括Vue 3在内的最小的Webpack设置。$ git clone https://github.com/vuejs/vue-next-webpack-preview.git vue3-experiment
$ cd vue3-experiment
$ npm install
2，添加sass 支持npm install --save-dev style-loader node-sass sass-loader
在webpack.co
Webpack 4.0 开始，为了应对 Parcel 等的挑战，配置越来越简单，甚至可以“零配置”。一个简单的 Webpack.config.js 配置文件 ：const path = require('path');
module.exports = {
entry: './src/index.js',
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'bundle.js'
}
};
添加上常用 loader 后的配置文件:const HtmlWebpackPlugin = r
Bundle: Produced from a number of distinct modules, bundles contain the final versions of source files that have already undergone the loading and compilation process.Bundle: bundle通常是由多个不同的模块产生，它是已经加载完毕和被编译后的源代码的最终版本。Bundle Splitting: This process offers one way of optimizing a build, allowing webp
场景1，有些用户很调皮，快速多次点击一个按钮。2，用户不必特地捣乱，他在一个正常的操作中，都有可能在一个短的时间内触发非常多次事件绑定程序。比如页面绑定的 resize 事件。分析怎么解决？函数节流就是一种办法。函数节流，简单地讲，就是让一个函数无法在很短的时间间隔内连续调用，只有当上一次函数执行后过了你规定的时间间隔，才能进行下一次该函数的调用。函数节流的原理挺简单的，估计大家都想到了，那就是定时器。当我触发一个时间时，先 setTimout 让这个事件延迟一会再执行，如果在这个时间间隔内又触发了事件，那我们就 clear 掉原来的定时器，再 setTimeout 一个新的定时器延迟一会执行
Webpack file-loader 升级后 src= "[object Module]" 的解决方法，当 file-loader 的版本是 4.3.0 及以上，则需要在 webpack.config.js 中手动配置属性 esModule 。{
test: /\.(jpg|jpeg|png|gif|svg)$/,
loader: "file-loader",
options: {
esModule: false, // 默认值是 true，需要手动改成 false
}
}
esModuleType: Boolean Default: trueBy de
后端篇地址：https://javascript.net.cn/article?id=649相关文档：https://restfulapi.cn/d/271前端代码主要功能是，连接服务器，发送心跳，断开服务器后自动连接。/**
* JSSDK 对象
*/
var PigIM = {
config: {}, // 配置
fromId: {}, // 发送者 ID
ws: {}, // Websocket 对象
connection: {},
listen: {},
heartbeatTimer: {},
作用：将一个数组转为用逗号分隔的参数序列。//该运算符主要用于函数调用。function push(array, ...items) { array.push(...items);} function add(x, y) { return x + y;} var numbers = [4, 38];add(...numbers) // 42//扩展运算符取代apply方法的一个实际的例子，应用Math.max方法，简化求出一个数组最大元素的写法。// ES5 的写法Math.max.apply(null, [14, 3, 77]) // ES6 的写法Math.max(...[14, 3, 7
body
canvas id="canvas" width="120" height="30" style="cursor: pointer" /canvas
input type="text" id="code" placeholder="不区分大小写"
input type="button" value="验证" onclick="clickEvent()"
/body
/html
script
var numArr = []
var canvas = document.querySelector('#canvas');
最近探究js原理的过程中遇到了这个挺有趣的问题。先贴代码：var a = {n:1}a.x = a = {n:2}alert(a.x) //undefined在弄懂这个之前，我们先普及一个知识点，就是在javascript运算符中，属性运算符的优先级高于赋值运算符的优先级。因此，a.x是先于赋值之前就进行的。就是说，a.x刚开始是undefined的，这是没错的。接下来我们探究一下连等赋值的赋值顺序：1、从左往右a.x赋值为{n:2};然后a赋值为{n:2};a的重新指向重写了a.x,即.x属性不存在，因此a.x输出为undefined。2、从右往左a赋值为{n:2};直接限制了a.x的赋值，
在文件上传的时候我们我们选择监控change事件来获取文件，如果第一次如果选择了A文件，当再次点开选择A 文件时，change事件没有触发，这时可以用如下方式处理.1. vue项目处理方式：this.$refs.uploadExcelId.value=null;复制该代码到项目中，并且把uploadExcelId换成自己input的ref即可。2. 普通js处理方式：event.target.value=”;尽量不要用删除dom元素，再添加这种操作方式，因为还需要在做事件绑定比较麻烦。
for和forEach的差别是后者不能正常的跳出循环（return、break等），其它的差别不大，把forEach转成for的写法就知道为什么你的for写法可以顺序执行而forEach不能：for:const report = async () = {
for (let i = 0, len = arr.length; i len; i++) {
await asyncFn(arr[i]);
}
};
forEach:const report = async () = {
arr.forEach(async (item) = {
axios API可以通过向 axios 传递相关配置来创建请求axios(config)// 发送 POST 请求
axios({
method: 'post',
url: '/user/12345',
data: {
firstName: 'Fred',
lastName: 'Flintstone'
}
});
// 获取远端图片
axios({
method:'get',
url:'http://bit.ly/2mTM3nY',
responseType:'stream'
})
.then(function(response) {
DOM由来
因为Internet Explorer4和Netscape Navigation4分别支持不同的DHTML（动态HTML）,为了统一标准，负责制定web通信标准的W3C(World Wide Web Consortium,万维网联盟)开始制定DOM.
DOM0
Netscape Navigator 4和IE4分别发布于1997年的6月和10月发布的DHTML，他们是未形成标准的试验性质的初级阶段的DOM，称为dom0,并不是标准。
DOM1
DOM1是W3C在1998年制定的标准，DOM1级主要定义了HTML和XML文档的底层结构。在DOM1中，DOM由两个模块组成：
1. 数组是计算机编程世界里最常见的数据结构。任何一种编程语言都包含数组，只是形式上 略有不同罢了。JavaScript数组的标准定义是:一个存储元素的线性集合(collection)，元素可以通过索引来任意存取，索引通常是数字，用来计算元素之间存储位置的偏移量。JavaScript 中的数组是一种特殊的对象，用来表示偏移量的索引是该对象的属性，索引可能是整数。然而，这些数字索引在内部被转换为字符串类型，这是因为 JavaScript 对象中的属性名必须是字符串。2. 创建数组最简单的方式是通过 [] 操作符声明一个数组变量:var numbers = [];var numbers = new
//获取滚动条当前的位置
function getScrollTop() {
//在标准w3c下，document.body.scrollTop恒为0，需要用document.documentElement.scrollTop来代替;
var scrollTop = 0;
if (document.documentElement && document.documentElement.scrollTop) {
scrollTop = document.documentElement.scrollTop;
}e
var base64String = /*base64图片串*/;//这里对base64串进行操作，去掉url头，并转换为byte var bytes = window.atob(base64String.split(',')[1]);//处理异常，将ASCII码小于0的转换为大于0，这里有两种写法 第一种：var ab = new ArrayBuffer(bytes.length);
var ia = new Uint8Array(ab);
for(var i = 0; i bytes.length; i++){
ia[i] = bytes.charCodeAt(i); //这里