diff --git "a/src/informal/\346\257\217\346\227\245\345\255\246\344\271\240.md" "b/src/informal/\346\257\217\346\227\245\345\255\246\344\271\240.md" index f96ecfd7a4..aea799b9ce 100644 --- "a/src/informal/\346\257\217\346\227\245\345\255\246\344\271\240.md" +++ "b/src/informal/\346\257\217\346\227\245\345\255\246\344\271\240.md" @@ -1,6 +1,8 @@ # 每日学习 -## 实现大数相加 + +## JS基础 +### 实现大数相加 ```js const addStrings = (num1, num2) => { let res = '' @@ -28,7 +30,8 @@ console.log(addStrings("456231421242131414212", "45623142124213141421")); ``` -## 实现Promise并发控制 +### 实现Promise并发控制 + ```js async function asyncPool(limit, fns) { const res = [] @@ -118,4 +121,217 @@ runTest().then(() => { ``` -## 0.1+0.2为什么不等于0.3 + +### 实现Promise串行 + +```js +async function serial(...args) { + return args.reduce((p, item) => p.then(() => item),Promise.resolve()) +} +``` + + + +### 实现Promise常见的方法 +```js +Promise.resolve = function(value) { + return new Promise((resolve, reject) => { + resolve(value) + }) +} + +Promise.reject = function(reason) { + return new Promise((resolve, reject) => { + reject(reason) + }) +} + +Promise.all = function(promises) { + const result = [] + let count = 0; + return new Promise((resolve, reject) => { + for (let i = 0;i < promises.length;i++) { + promises[i].then((value) => { + result[i] = value; + count++ + if (count >= promises.length) { + resolve(result) + } + }, reject); + } + }) +} + +Promise.race = function(promises) { + return new Promise((resolve, reject) => { + for (let i = 0;i < promises.length;i++) { + promises[i].then(resolve, reject) + } + }) +} + +Promise.deferred = function() { + const def = {} + def.promise = new Promise((resolve, reject) => { + def.resolve = resolve + def.reject = reject + }) + return def; +} + +Promise.allSettled = function(promises) { + const result = [] + return new Promise((resolve) => { + for (let i = 0;i < promises.length;i++) { + promises[i].then((value) => { + result[i] = { + status: 'fullfilled', + value + } + }, (reason) => { + result[i] = { + status: 'reject', + reason + } + }).finally(() => { + if (i === promises.length - 1) { + resolve(result) + } + }) + } + }) +} +``` + +### 实现ajax请求 + +```js + +const xhr = new XMLHttpRequest() +xhr.open(method, url,true) + +xhr.setRequestHeader('Content-Type', 'application/json') + +xhr.onreadystatechange = function() { + if (xhr.readyState === 4 && xhr.status === 200) { + const text = xhr.responseText; // 获取响应内容 + } +} +``` + +readyState 是 XMLHttpRequest 对象的一个属性,用来标识当前 XMLHttpRequest 对象处于什么状态。 +readyState 总共有 5 个状态值,分别为 0~4,每个值代表了不同的含义 + +0:未初始化 -- 尚未调用.open()方法; +1:启动 -- 已经调用.open()方法,但尚未调用.send()方法; +2:发送 -- 已经调用.send()方法,但尚未接收到响应; +3:接收 -- 已经接收到部分响应数据; +4:完成 -- 已经接收到全部响应数据,而且已经可以在客户端使用了; +编辑此页面 + + + + +### 实现apply和call + +```js +Function.prototype.call = function(context) { + context.fn = this; + const arr = [] + for (let i = 1;i < arguments.length;i++) { + arr.push(`arguments[${i}]`) + } + const ret = eval(`context.fn(${arr})`) + delete context.fn; + return ret; +} + +Function.prototype.apply = function (context, args) { + var context = context || window; + context.fn = this; + var res; + if (!args) { + res = context.fn(); + } else { + const arr = []; + for (var i = 0; i < args.length; i++) { + arr.push("args[" + i + "]"); + } + res = eval("context.fn(" + arr + ")"); + } + delete context.fn; + return res; +}; +``` + +### 实现 asyncToGenerator +```js +function asyncToGenerator(fn) { + return function() { + const gen = fn.bind(this, arguments) + return new Promise((resolve, reject) => { + function step(key, args) { + let res + try { + res = gen[next](args) + } catch(e) { + return reject(e) + } + + const { value, done } = res; + if (done) { + return resolve(value) + } else { + return Promise.resolve(value).then(val => { + step('next', val) + }).catch((e) => { + step('throw', e); + }); + } + } + step('next') + }) + } +} + +// 一个简单的 Generator 函数示例 +function* exampleGenerator() { + yield new Promise((resolve) => setTimeout(() => resolve('Hello'), 1000)); + yield new Promise((resolve) => setTimeout(() => resolve('World'), 1000)); +} + +// 使用 asyncToGenerator 转换 Generator 函数 +const asyncFunction = asyncToGenerator(exampleGenerator); + +// 使用转换后的 async 函数 +asyncFunction() + .then((result) => console.log(result)) + .catch((error) => console.error(error)) +``` + + + +### 0.1+0.2为什么不等于0.3 +在javascript中,Number类型使用的是IEEE754标准来表示浮点数,它会使用64位来存储一个浮点数。 + +而0.1和0.2的二进制是无限循环的,得出来的值也是无限循环,所以不等于0.3 + +**QA: 如何求小数的二进制** +0.625 * 2 = 1.25,所以第一位是1。 小数部分变为0.25。 0.25 * 2 = 0.5,所以第二位是0。 小数部分变为0.5。 0.5 * 2 = 1,所以第三位是1 + + +### let、var 和 const 的区别 +``` +``` + + + +### WeakMap和Map的区别 ++ WeakMap的key只能是对象 ++ WeakMap无法遍历 ++ WeakMap没有`clear方法` ++ WeakMap没有`size属性` ++ 没有被引用的key,会被垃圾回收 + +### axios如何取消请求 +如果该请求已被发出,`XMLHttpRequest.abort()` 方法将终止该请求。当一个请求被终止,它的 `readyState` 将被置为 `XMLHttpRequest.UNSENT (0)`,并且请求的 `status 置为 0`。 \ No newline at end of file