Lo-Dash | 易学教程

lodash之_.difference _.differenceBy _.differenceWith方法

阅读更多关于 lodash之_.difference _.differenceBy _.differenceWith方法

注：前提引入lodash.min.js 1、_.difference _.difference(array, [values]) difference：英文释义：差别; 差异; 不同(之处); 变化(之处); 差; 差额; 意见分歧; 不和; 功能：创建一个新数组，这个数组中的值，为第一个数字（array参数）排除了给定数组中的值。(从第一个数组中排除第二个数组中的每个项，再返回一个新数组)。参数： array(Array) ：要检查的数组。 [values](...Array) ：排除的值。返回值： (Array) ：返回一个过滤值后的新数组。结果如下： 2、_.differenceBy _.differenceBy(array, [values], [iteratee=_.identity]) 功能：官方语言：这个方法类似_.difference，除了它接收一个iteratee(迭代器)，调用array和values中的每个元素以产生比较的标准，结果值是从第一数组中选择。iteratee会调用一个参数：（value)。注：（首先使用迭代器分别迭代array和values中的每个元素，返回的值作为比较值。），这个方法会返回一个新数组大白话：和_difference 方法基本上一样，但是多提供了一个iteratee参数，这个参数可以在比较前先做一个处理

lodash之_.chunk _.compact _.concat方法

阅读更多关于 lodash之_.chunk _.compact _.concat方法

注：前提引入lodash.min.js 1、_.chunk _.chunk(array, [size=1]) chunk：英文释义：厚块; 厚片; 大块; 相当大的量; 话语组成部分; 组块; 功能：将数组（array）拆分成多个size长度的区块，并将这些区块组成一个新数组。如果array无法被分割成全部等长的区块，那么最后剩余的元素将组成一个区块。参数： array(Array) ：需要处理的数组。 [size=1](number) ：每个数组区块的长度。（如果不传，默认按照一个进行分割）返回值： (Array)：返回一个包含拆分区块的新数组。不会影响原先的数组（注：相当于一个二维数组）。结果如下： 2、_.compact _.compact(array) chunk：英文释义：小型的; 袖珍的; 紧凑的; 体积小的; 紧密的; 坚实的; 功能：创建一个新数组，包含原数组中所有的非假值元素。例如false,null,0,"",undefined和NaN都被认为是"假值"。参数： array(Array) ：待处理的数组。返回值：（Array）：返回过滤掉假值的新数组（不影响之前的数组） 3、_.concat _.concat(array, [values]) concat：英文释义：函数; 合并数组; 合并多个字符串; 联系我们; 功能：

gitbook的安装与使用

阅读更多关于 gitbook的安装与使用

GitBook 是一个基于 Node.js 的命令行工具，可使用 Github /Git 和 Markdown 来制作精美的电子书。一、官网下载nodejs直接安装传送门，安装完成后如下：可以看到npm也安装了，此时可以在cmd控制台进行验证（win+r）,输入cmd进入控制台： C:\pc>node - v v8. 11.1 C:\pc>npm - v 5.6. 0 二、安装gitbook 在cmd控制台输入如下命令进行安装： C:\Users\wwwli>npm install gitbook-cli -g C:\Users\wwwli\AppData\Roaming\npm\gitbook -> C:\Users\wwwli\AppData\Roaming\npm\node_modules\gitbook-cli\bin\gitbook.js+ gitbook-cli@2.3.2 added 578 packages from 672 contributors in 251.912s 查看安装的版本： C:\Users\wwwli>gitbook -V CLI version: 2.3.2 GitBook version: 3.2.3 三、安装gitbook editor windows版官网地址： gitbook editor for windows 备用下载链接

js 数独生成算法

阅读更多关于 js 数独生成算法

生成任意空格的数独，但是由于其确定解的条件是17个提示数以上，我们指定提示数为20到35之间算法思路依次使用dfs进行填空，将所有不合法的数字去除后随机选择使用变化的概率值来确定是否该空需要被填充，概率值为需要的提示数个数除以剩余的格子这样可以保证一定可以填充到该数目的提示数且有一定的随机性当提示数填充完毕后即结束结果 [ [0, 0, 0, 9, 5, 0, 1, 0, 0], [0, 7, 8, 0, 6, 0, 0, 0, 4], [0, 0, 0, 0, 0, 0, 0, 5, 0], [0, 0, 7, 0, 9, 0, 0, 0, 0], [0, 0, 0, 0, 0, 0, 2, 0, 0], [0, 1, 0, 0, 0, 0, 0, 0, 5], [0, 5, 0, 6, 0, 0, 0, 7, 0], [0, 0, 9, 0, 0, 4, 0, 0, 0], [0, 0, 0, 0, 0, 1, 5, 0, 0] ] 使用之前的算法求解 2,3,4,9,5,7,1,6,8 5,7,8,1,6,2,3,9,4 1,9,6,3,4,8,7,5,2 3,4,7,2,9,5,6,8,1 9,8,5,4,1,6,2,3,7 6,1,2,7,8,3,9,4,5 8,5,1,6,2,9,4,7,3 7,2,9,5,3,4,8,1,6 4,6,3,8,7,1,5,2

lodash之_.drop _.dropRight方法

阅读更多关于 lodash之_.drop _.dropRight方法

注：前提引入lodash.min.js 1、_.drop _.drop(array, [n=1]) 功能：创建一个切片数组，去除array前面的n个元素。（n默认值为1）参数： array(Array) ：要查询的数组。 [n=1](number) ：要去除的元素个数。返回值： (Array) ：返回array剩余切片。结果如下： 2、_.dropRight _.dropRight(array, [n=1]) 功能：创建一个切片数组，去除array后面的n个元素。（n默认值为1）参数： array(Array) ：要查询的数组。 [n=1](number) ：要去除的元素个数。返回值： (Array) ：返回array剩余切片。结果：来源： oschina 链接： https://my.oschina.net/u/4446873/blog/4304433

JavaScript专题系列之节流（系列四）

阅读更多关于 JavaScript专题系列之节流（系列四）

节流目录前言一、核心和基本实现二、节流进阶写在最后前言接着《JavaScript专题进阶之防抖》，我们来聊一聊节流——另一个优化函数的思想。我们还是以移动事件举例 <!DOCTYPE html> < html lang = " en " > < head > < meta charset = " UTF-8 " > < meta name = " viewport " content = " width=device-width, initial-scale=1.0 " > < meta http-equiv = " X-UA-Compatible " content = " ie=edge " > < title > Document </ title > < style > #wrapper { width : 100% ; height : 140px ; background : rgba ( 0, 0, 0, 0.8 ) ; color : #fff ; font-size : 30px ; font-weight : bold ; line-height : 140px ; text-align : center ; } </ style > </ head > < body > < div id = " wrapper " > </ div > <

vue首屏加载优化总结及整理

阅读更多关于 vue首屏加载优化总结及整理

页面加载性能是一个老生常谈的问题，但是却异常重要，尤其在访问量大的商业软件中。但是有很多开发者在开发过程中压根就没有考虑过这个问题。大家在开发业务代码的过程中，也就忽略了这个增加工作量，也不会带来什么直观的工作内容。写在前面，这里以vue框架为例，基于vue-cli3的开发方式首先，使用webpack分析工具，查看当前项目的依赖，分析依赖及打包情况，对症下药安装插件 npm i webpack-bundle-analyzer -D 在vue.config.js中，添加如下配置： chainWebpack: (config)=>{ /* 添加分析工具*/ if (process.env.NODE_ENV === 'production') { if (process.env.npm_config_report) { config .plugin('webpack-bundle-analyzer') .use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin) .end() config.plugins.delete('prefetch') } } ... } 执行命令 npm run build --report 执行成功后，浏览器会打开一个窗口，显示当前依赖的大小及各打包文件情况结合自己的项目情况

lodash compact & concat

阅读更多关于 lodash compact & concat

前置本篇随笔包含 _.compact 和 _.concat 及其依赖的工具函数。你可能需要一些 JavaScript 基础知识才能看懂一些没有注释的细节。 compact _.compact(array) 创建一个新数组，包含原数组中所有的非假值元素。例如 false , null , 0 , "" , undefined , 和 NaN 都是被认为是“假值”。 /** * Creates an array with all falsey values removed. The values `false`, `null`, * `0`, `""`, `undefined`, and `NaN` are falsey. * * @since 0.1.0 * @category Array * @param {Array} array The array to compact. * @returns {Array} Returns the new array of filtered values. * @example * * compact([0, 1, false, 2, '', 3]) * // => [1, 2, 3] */ function compact(array) { let resIndex = 0 const result = [] if (array =

vue3 watch 函数节流制作自己的二维码生成器

阅读更多关于 vue3 watch 函数节流制作自己的二维码生成器

将输入框里面的字符串实时的转成二维码在input内容改变的时候生成二维码, 但是可以看到每次都会触发这个生成操作用lodash的节流函数包一层, 这样就能看到基本是达到了效果, 减少了很多次函数调用为了看到效果, 下面是200ms的输出 <template> <div> <textarea v-model="text" cols="30" rows="10" placeholder="请输入文本..." ></textarea> <img src="" alt="" ref="imgRef" /> </div> </template> <script> import { ref, onMounted, watch } from "vue"; import QRCode from "qrcode"; import throttle from "lodash-es/throttle"; export default { setup() { const text = ref(""); const imgRef = ref(null); const handleInput = throttle(() => { console.log("watch", text.value); QRCode.toDataURL(text.value || "hello world!").then(

lodash之_.fill _.findIndex _.findLastIndex方法

阅读更多关于 lodash之_.fill _.findIndex _.findLastIndex方法

注：前提引入lodash.min.js 1、_.fill _.fill(array, value, [start=0], [end=array.length]) 功能：使用value值来填充（替换）array，从start位置开始，到end位置结束，（但不包含end位置）参数： array(Array) ：要填充改变的数组。 value(*) ：填充给array的值。 [start=0] (number)：开始位置，默认0 [end=arr.length](number)：结束位置（默认arr.length）返回值： (Array) ：返回array。结果如下： 2、_.findIndex _.findIndex(array, [predicate=_.identity], [fromIndex=0]) 功能：区别是该方法返回第一个通过 predicate判断为真值得元素的索引值(index)，而不是元素本身。参数： array(Array) ：要搜索的数组。 [predicate=_.identity](Array|Function|Object|String) ：这个函数会在每一次迭代调用。 [formIndex=0](number):This index to Search from. 返回值： (number) ：返回找到元素的索引值（index），否则返回

订阅 Lo-Dash