随笔分类 - js
js相关
摘要：这里分享下JS实现的九宫格抽奖案例，首先说明该版本抽奖过程中均为匀速转动。 具体步骤和原理十分简单，详解代码即可 代码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" cont
阅读全文
摘要：参考文章 浅谈JS函数防抖及应用场景 1、场景演示 疯狂点击按钮 正常情况下，点击提交按钮，应该发送接口请求 ，如果用户网络不够畅通，接口请求需要1s完成，期间你提交了多次.... ....，此时在后台也就默认接受了很多次的请求，这种方式及其浪费服务器资源，所以需要在前端做个防抖和节流。本节介绍下防
阅读全文
摘要：先说一下async的用法，它作为一个关键字放到函数前面， async function timeout() { return 'hello world';} 只有一个作用, 它的调用会返回一个promise 对象。调用一下看看就知道了，怎么调用？async 函数也是函数，所以它的调用和普通函数的调用
阅读全文
摘要：ES6为Array增加了find()，findIndex函数。 find()函数用来查找目标元素，找到就返回该元素，找不到返回undefined。 findIndex()函数也是查找目标元素，找到就返回元素的位置，找不到就返回-1。 他们的都是一个查找回调函数。 [1, 2, 3, 4].find(
阅读全文
摘要：JavaScript中我们经常会遇到拷贝数组的场景，但是都有哪些方式能够来实现呢，我们不妨来梳理一下。 1、扩展运算符（浅拷贝） 自从ES6出现以来，这已经成为最流行的方法。它是一个很简单的语法，但是当你在使用类似于React和Redux这类库时，你会发现它是非常非常有用的。 numbers = [
阅读全文
摘要：React里调用方法常见的方式有两种 （1）触发时通过回调函数触发 <Button type="primary" onClick={()=>this.updateBar()}>更新</Button> （2）直接通过方法名触发 <Button type="primary" onClick={this.
阅读全文
摘要：前言 JavaScript 发展至今已经发展出多种数组的循环遍历的方法,不同的遍历方法运行起来那个比较快,不同循环方法使用在那些场景,下面将进行比较: 各种数组遍历的方法 for 语句 代码: var arr = [1,2,4,6] for(var i = 0, len = arr.length;
阅读全文
摘要：注意： 1、Object.assign() 只是一级属性复制，比浅拷贝多深拷贝了一层而已。用的时候，还是要注意这个问题的。 2、简单实现深拷贝的方法，当然，有一定限制，如下：JSON.parse(JSON.stringify());思路就是将一个对象转成json字符串，然后又将字符串转回对象。 Ob
阅读全文
摘要：随着HTML5的出现，input元素新增了多种类型，用以接受各种类型的用户输入。其中，button、checkbox、file、hidden、image、password、radio、reset、submit、text这10个是传统的输入控件，新增的有color、date、datetime、date
阅读全文
摘要：reduce()方法可以搞定的东西，for循环，或者forEach方法有时候也可以搞定，那为啥要用reduce()？这个问题，之前我也想过，要说原因还真找不到，唯一能找到的是：通往成功的道路有很多，但是总有一条路是最捷径的，亦或许reduce()逼格更高... 1、语法 arr.reduce(cal
阅读全文
摘要：概述 switch语句对一个表达式求值，将结果与 case 子语句比较，如果匹配，则从 case 处的语句向下执行。 语法 break;语句是可选择的，如果遇到break;则会跳出整个switch语句。如果没有任何case匹配，则进入到default:的分支。default:分支也是可选的。 swi
阅读全文
摘要：常见的一个面试题：简单谈下JSONP解决ajax跨域请求的原理？ 1、局限：只能跨域处理Get请求 2、本质是get请求 3、实现方式：分为浏览器端和服务器端 浏览器端通过sript来实现（发请求前编写一个用来处理请求的回调函数，然后传递给服务器） 4、小结 .
阅读全文
摘要：注意： 常见的方法：开发环境阶段 在package.json添加proxy字段进行配置，该配置方案仅用于开发环境 生产环境一般需要后端工程师进行配置，如果需要前端进行配置，需要最后在工程化项目打包运行时进行配置 本质：
阅读全文
摘要：这里分享个常见的测试调试方案，相对于常用的console.log()提升了一些档次... ... 如图所示我们在react项目组件正式render之前，加了个debugger断点 接下来刷新页面如下 我们可以点击下一步继续往下执行代码 我们会看到，当执行玩openKeyPath赋值后，再往下执行时，
阅读全文
摘要：项目里经常遇到优化代码情况，例如回调地狱 1、现在比较流行的解决这个问题的方法是使用 Promise，可以将嵌套的回调函数展平。但是写代码和阅读依然有额外的负担。 2、另外一个方案是使用 ES6 中新增的 generator，因为 generator 的本质是可以将一个函数执行暂停，并保存上下文，再
阅读全文
摘要：（1）前言 （2）安装 首先安装相关依赖 >npm i redux-saga --save （3）配置 接下来开始进行编写配置，文件位置src/store/index.js。先将之前的redux中间件redux-thunk做下备份，然后开始配置redux-saga中间件 redux-saga中间件相
阅读全文
摘要：介绍一下一个函数式编程里面非常重要的概念 —— 纯函数（Pure Function）。 简单来说，一个函数的返回结果只依赖于它的参数，并且在执行过程里面没有副作用，我们就把这个函数叫做纯函数。这么说肯定比较抽象，我们把它掰开来看： 函数的返回结果只依赖于它的参数。 函数执行过程里面没有副作用。 函数
阅读全文
摘要：纯函数是函数式编程的基础，需要重点理解。纯函数的作用，可以看《JavaScript函数式编程之为什么要函数式编程（非严谨技术层面的扯淡）》。 纯函数的概念： 纯函数是这样一种函数，即相同的输入，永远会得到相同的输出，而且没有任何可观察的副作用。 他的重点在于“相同的输入，永远会得到相同的输出”，后面
阅读全文
摘要：如果箭头函数的代码块部分多于一条语句，就要使用大括号将它们括起来，并且使用return语句返回。 var sum = (num1, num2) => { return num1 + num2; } 箭头函数返回对象，由于大括号被解释为代码块，所以如果箭头函数直接返回一个对象，必须在对象外面加上括号。
阅读全文
