CjBkl的博客

JavaScript 实现选择排序

CjBkl — Sun, 18 Jul 2021 11:43:39 +0800

选择排序的基本思想为每一趟从待排序的数据元素中选择最小（或最大）的一个元素作为首元素，直到所有元素排完为止。在算法实现时，每一趟确定最小元素的时候会通过不断地比较交换来使得首位置为当前最小，交换是个比较耗时的操作。其实我们很容易发现，在还未完全确定当前最小元素之前，这些交换都是无意义的。我们可以通过设置一个变量 min，每一次比较仅存储较小元素的数组下标，当轮循环结束之后，那这个变量存储的就是当前最小元素的下标，此时再执行交换操作即可。代码实现： function selectSort(ar

JavaScript 实现冒泡排序

CjBkl — Sun, 18 Jul 2021 11:16:44 +0800

冒泡排序的基本思想是，对相邻的元素进行两两比较，顺序相反则进行交换，这样，每一趟会将最小或最大的元素“浮”到顶端，最终达到完全有序。代码实现： function bubbleSort(arr) { if (!Array.isArray(arr) || arr.length <= 1) return; let lastIndex = arr.length - 1; while (lastIndex > 0) { // 当最后一个交换的元

JavaScript 如何查找一篇英文文章中出现频率最高的单词？

CjBkl — Sun, 18 Jul 2021 10:47:05 +0800

直接上代码 function findMostWord(article) { // 合法性判断 if (!article) return; // 参数处理 article = article.trim().toLowerCase(); let wordList = article.match(/[a-z]+/g), visited = [], maxNum = 0, maxWord = ""; article = .

js 中倒计时的纠偏实现？

CjBkl — Sun, 18 Jul 2021 10:27:31 +0800

在前端实现中我们一般通过 setTimeout 和 setInterval 方法来实现一个倒计时效果。但是使用这些方法会存在时间偏差的问题，这是由于 js 的程序执行机制造成的，setTimeout 和setInterval 的作用是隔一段时间将回调事件加入到事件队列中，因此事件并不是立即执行的，它会等到当前执行栈为空的时候再取出事件执行，因此事件等待执行的时间就是造成误差的原因。一般解决倒计时中的误差的有这样两种办法：（1）第一种是通过前端定时向服务器发送请求获取最新的时间差，以此来校准倒计时时

JavaScript 中 Math.ceil 和 Math.floor

CjBkl — Sun, 18 Jul 2021 10:23:28 +0800

Math.ceil() === 向上取整，函数返回一个大于或等于给定数字的最小整数。 Math.floor() === 向下取整，函数返回一个小于或等于给定数字的最大整数。

JavaScript 使用闭包实现每隔一秒打印 1,2,3,4

CjBkl — Sun, 18 Jul 2021 10:20:06 +0800

// 使用闭包实现 for (var i = 0; i < 5; i++) { (function(i) { setTimeout(function() { console.log(i); }, i * 1000); })(i);} // 使用 let 块级作用域 for (let i = 0; i < 5; i++) { setTimeout(function() { console.log(i); }, .

vue 中 key 值的作用？

CjBkl — Mon, 12 Jul 2021 23:03:19 +0800

vue 中 key 值的作用可以分为两种情况来考虑。第一种情况是 v-if 中使用 key。由于 Vue 会尽可能高效地渲染元素，通常会复用已有元素而不是从头开始渲染。因此当我们使用 v-if 来实现元素切换的时候，如果切换前后含有相同类型的元素，那么这个元素就会被复用。如果是相同的 input 元素，那么切换前后用户的输入不会被清除掉，这样是不符合需求的。因此我们可以通过使用 key 来唯一的标识一个元素，这个情况下，使用 key 的元素不会被复用。这个时候 key 的作用是

Vue 中 vue-router的导航钩子函数

CjBkl — Sun, 11 Jul 2021 17:32:57 +0800

（1）全局的钩子函数 beforeEach 和 afterEach ，beforeEach 有三个参数，to 代表要进入的路由对象，from 代表离开的路由对象。next 是一个必须要执行的函数，如果不传参数，那就执行下一个钩子函数，如果传入 false，则终止跳转，如果传入一个路径，则导航到对应的路由，如果传入 error ，则导航终止，error 传入错误的监听函数。（2）单个路由独享的钩子函数 beforeEnter，它是在路由配置上直接进行定义的。（3）组件内的导航钩子主要有这三种：

小程序云开发如何实现随机获取数据库里面的数据？

CjBkl — Sun, 11 Jul 2021 17:23:14 +0800

直接上代码 const result = db.aggregate().sample({ size: 5 }).match({ is_show: true }).end() // size 每次随机的条数 // is_show 数据过滤条件，不需要的话直接match 去掉就行 // 具体方法说明可以参考官网说明（完结）下面是我的小程序，欢迎扫码支持 ...

小程序如何实现抖音视频效果？

CjBkl — Sun, 11 Jul 2021 17:01:11 +0800

1、wxml部分代码，主要是利用swiper 标签滑动切换，事件处理，具体参数说明可以去小程序官网文档看。https://developers.weixin.qq.com/miniprogram/dev/component/swiper.html

小程序如何实现满屏播放视频效果？

CjBkl — Sun, 11 Jul 2021 16:05:38 +0800

在小程序开发文档中，有个小程序页面配置，navigationStyle 有两个值，default默认样式custom自定义导航栏，只保留右上角胶囊按钮。可以参考文档具体说明 https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/page.html 这个最好只在一级页面设置，如果当前是二级页面的话，设置满屏左上角就没有返回键了，这个要注意下。（完结）下面是我自己的小程序，不过我放在二级页面里面 ..

小程序一页显示多个视频video，细节交互优化处理

CjBkl — Sun, 11 Jul 2021 15:56:24 +0800

1、页面部分代码