- 博客(28)
- 收藏
- 关注
RSS订阅原创 叮铃铃~： 一个前端铃声/提示音组件
这是一个使用简单、通用、酷炫的前端铃声🔔组件～可用于铃声、消息提示音、交互音效等诸多场景。将你的音频文件地址传给组件的src参数，即可使用自定义音频源。可以是网络资源或者项目内资源。项目内资源采用的是绝对路径，因为使用相对路径容易在本地构建或者打包过程中出现问题，且作为第三方组件的easy-ring无法从你项目里的相对路径找到音频文件。此时yourAudio变量就是你音频文件的绝对路径，将这个变量传给src参数即可。将一串简谱的字符串传给musicText参数，即可使用自定义简谱音效。
2022-10-23 11:14:17
696
1
原创 叮铃铃~：前端铃声组件easy-ring 1.0版本文档
目前组件已经更新到2.0版本，这篇文章是提供给使用旧1.0版本的开发者阅读的。如果你是新尝试easy-ring的开发者，建议可以直接使用2.0版本。😊2.0版本文档：https://juejin.cn/post/7157534443643600903/
2022-10-23 11:12:09
1105
原创 【飞书小程序】在任意文件里获取当前页面实例（this）
本文适合对飞书小程序进行过一定开发的读者，目的是提升和优化飞书原生的开发体验。可能有的读者会疑问，获取页面的实例（this）有什么用。这里简单介绍一下背景。在开发飞书小程序的时候，业务逻辑可能很复杂，我们想要把很重的代码进行拆分，封装成不同的模块。这样逻辑会更清晰，代码可读性也会更好，并且更易于维护。这时候，少不了需要在模块里获取页面Page实例，从而进行一些操作。比如最基础的，在模块js文件里对页面的data属性进行读取和改值，即，在模块文件里使用飞书提供的this.setData方法改值、this.da
2022-06-12 19:55:26
955
原创 【飞书小程序】在任何模块里使用this.setData和this.data
在开发飞书小程序的时候，业务逻辑可能很复杂，我们想要把很重的代码进行拆分，封装成不同的模块。这样逻辑会更清晰，代码可读性也会更好，并且更易于维护。但是问题来了，小程序页面的很多逻辑可能都涉及到对data的读取和更改。如果把它们拆分到模块里，就我们需要在模块中使用this.setData去改变页面的data，或者使用this.data去直接读取data值。但是尝试后可以发现，在模块里输出一个函数，函数里是无法正常调用this.setData或者this.data的，这两个属性为undefined。那么该如何
2022-06-05 15:47:00
468
原创 还在手动创建.vue文件？给你一个工具自动生成页面目录和文件
根据提供的router对象，自动创建对应的页面目录以及.vue组件文件（SFC）
2022-01-23 12:26:42
1021
1
原创 叮铃铃~： 一个Vue铃声/提示音组件
背景/前言之前的一个功能需求，需要在页面接收消息，一旦有了新消息之后，需要用铃声进行提醒。因为没有找到类似的比较便捷的组件，所以就自己写了一个。然后想着能不能尝试下做成一个公共的组件，发布出去让其他开发者也用用？于是就试着写了一个项目（项目地址在最后），发布成了npm包。虽然组件本身的开发很简单，但是从构建npm包到发布的整个流程，遇到的坑还是很多的，涉及到了：如何将一个Vue组件构建成可以直接引用的包如何将这个组件写成类似插件的形式，让使用者能够直接全局使用如何更改vue-cli配置，使得其
2021-12-26 15:52:54
2962
20
原创 微信小程序踩坑指南（三）＜template＞和＜block＞
<template>小程序里的和Vue里的表达的不是一种含义。小程序的template是一种模板，不能用于直接显示的代码。它正常情况下不显示，需加载使用。<block>并不是一个组件，它仅仅是一个包装元素，不会在页面中做任何渲染，只接受控制属性（如wx:if、wx:for）。参考文章： 微信小程序block标签的作用...
2021-04-19 21:06:50
858
原创 微信小程序踩坑指南（二）wx:for的坑
wx:for的写法是：wx:for="{{items}}" 注意：要加 {{}}。即使是用了wx:，也还是需要加 {{}} 指明其为响应性数据。这点与Vue不同，个人感觉这种语法写法语义上有点累赘。
2021-04-19 21:01:44
316
原创 微信小程序踩坑指南（一）前言和目录
前言近段时间为公司开发一个微信小程序，由于之前只写过demo，没有完整地走完开发流程，因此这次的开发毫无意外地踩了很多坑，但同时也收集到了一些解决方案、文章、资料。于是想着把这些东西整理、系统地汇集起来，一方面自己查阅起来方便，一方面为入坑的新人提供一些便捷。本来想把这一系列起名叫《微信小程序新手指南》，但想想口气有点大，所以还是换成了这个名字。这一系列主要是针对作为新人在需求里比较容易遇到、或者比较容易犯错的坑点。在小程序老手、大佬面前可能是班门弄斧。如果文章中的内容有问题，或者有更好的解决方案，欢
2021-04-19 20:53:47
144
原创 算法学习（动态规划）- 数塔问题
前言之前碰到了扔鸡蛋问题（给你2个鸡蛋，在100层楼上扔，要求想出一个好的策略，去测出哪一层楼开始鸡蛋就会碎掉），一直摸不着头脑。后来才知道可以使用“动态规划”这种思想（或者叫算法范式）去解决这个问题。但是看了一些鸡蛋问题和动态规划的文章，依然只是流于形式，并不能理解其中的精髓。想想或许是鸡蛋问题对我现在而言难了一些，所以只好找了一些其它的动态规划问题，从简单入手，先去理解“动态规划”的思想精髓，再反过来去思考“鸡蛋问题”。其中一个经典问题是01背包问题，这是我之前一直想搞懂的一个问题。看了一篇文章，
2020-11-28 17:58:21
10989
5
原创 算法学习-颜色分类
问题题目出自Leetcode：给定一个包含红色、白色和蓝色，一共 n 个元素的数组，原地对它们进行排序，使得相同颜色的元素相邻，并按照红色、白色、蓝色顺序排列。此题中，我们使用整数 0、 1 和 2 分别表示红色、白色和蓝色。进阶：一个直观的解决方案是使用计数排序的两趟扫描算法。 首先，迭代计算出0、1 和 2 元素的个数，然后按照0、1、2的排序，重写当前数组。你能想出一个仅使用常数空间的一趟扫描算法吗？分析这个问题本质上就是排序，因此方法很多。但是我这里对“进阶”中所说的“仅使用
2020-11-28 09:37:07
734
原创 Vue + qiankun框架 样式混乱问题的解决办法
前言问题与现象子应用与父应用不断切换的过程中，子应用内的样式突然乱掉。实际上是子应用加载的<style>标签少了，导致遗失了样式。解决1）第一种修复函数/* main.js */// 定义styleCount用于记录<style>标签数，styleList用于保存<style>节点对象let styleCount = 0, styleList = []// 定义一个修复函数function fixStyleBug() { let qiankunSty
2020-11-20 18:34:51
7880
2
原创 记一次vue-cli3下filemanager-webpack-plugin的报错和解决
附上一篇filemanager-webpack-plugin插件的使用方法：[email protected] 直接打包成zip压缩文件前言因为对之前项目进行再次开发时，遇到了太多因维护引起的问题（满满的心智负担，导致San值严重下降。。( ′Д`)）。所以想尝试一下，重新git clone一次某vue项目，想从二次开发者的视角去窥探，看流程能不能顺利。果不其然，出了问题。正文项目是使用Vue-cli3建立。之前本地的旧项目代码一直能够正常工作，但是重新clone一次之后，却报了错。把项目代码重新“git
2020-09-06 21:01:30
4173
3
原创 JavaScript力扣算法学习之回文对匹配（二）枚举前缀和后缀
相关链接：JavaScript算法学习之回文对匹配（一）暴力法接着上篇，在上篇里我使用了暴力法来解决回文匹配的问题，尽管能够通过力扣的提交测试，但是太过粗暴，遇到大数据量的情况下效率不是很高。所以我们肯定是要找一个聪明的办法的。思来想去，自己是想不出思路了，所以直接去看了官方的提供的方法，然后我用程序实现。就当练练编程，顺便学习一下新的思想和思维。官方解法地址枚举前缀和后缀假设有两个字符串s1、s2。并且，s1 + s2 能够构成一个回文串。这时候，会有三种情况：1）s1.length =
2020-08-28 09:36:54
209
原创 JavaScript算法学习之“1”的个数（下）
对“拆解”的分析为了理解为什么n的位数包含“1”时，我的改进函数就失效了，决定选取几个简单的数字，把我们实际要计算的东西呈现出来。有了直观的图，就更容易发现问题所在。8: 1234567816: 12345678910 11121314151625: 12345678910 11121314151617181920 212223242536: 12345678910 11121314151617181920 21222324252627282930 313233343536456: 123..
2020-08-27 09:45:17
473
原创 JavaScript算法学习之“1”的个数（上）
写在前面的话这是我自己思考的一个思路，写作此文的目的是为了记录自己思考的过程，并从思维的过程探索出一些原理和感悟。我的解法不一定是最优的。官方的解法，是通过归纳数学规律来进行解决的。虽然我也知道其中包含着数学规律，但是正常来说，除非是数学思维特别灵敏，否则按照平时我们程序员平时的思维状态，很难静下心（能力也不一定达得到）去作纯粹数学层面的归纳和推导。所以我不想从数学家的角度，而是单纯从程序开发者的角度去试着分析和推理，期望最后得到好的解决方法。上面也说了，我的方法不一定是最优的，如果想要直接看官方的解
2020-08-27 09:44:41
230
原创 JavaScript算法学习之回文对匹配（一）暴力法
起因为了深入感受算法的好处和作用，决定在力扣上找一些相关的题目来练习。因为很多题目与使用哪种编程语言无关，注重的是解决问题的思路本身，能够用多种语言进行编程测试，所以也很方便我使用JavaScript去实现。最后找了一道回文对匹配的问题，进行入手，难度级别为“困难”。题目描述是这样的：给定一组 互不相同 的单词， 找出所有不同 的索引对(i, j)，使得列表中的两个单词， words[i] + words[j] ，可拼接成回文串。示例 1：输入：[“abcd”,“dcba”,“lls”,“
2020-08-23 17:08:21
1048
原创 JavaScript数组扁平化
看到了这样一道题目，描述如下：已知如下数组：var arr = [ [1, 2, 2], [3, 4, 5, 5], [6, 7, 8, 9, [11, 12, [12, 13, [14] ] ] ], 10];编写一个程序将数组扁平化并去除其中重复部分数据，最终得到一个升序且不重复的数组有几种解决方法，主要是扁平化的不同，去重和升序的做法都一样，利用了ES6的Set对象和数组sort方法。所谓数组的扁平化，是将一个嵌套多层的数组 (嵌套可以是任何层数）转换为只有一层的数组。方法一var
2020-08-04 13:50:20
215
原创 JavaScript判断是否包含中文字符（汉字、中文标点）
网上资料找来找去，一堆的错误。干脆自己结合零散的信息写一个。function checkChinese (str) { var reg = new RegExp("([\u4E00-\u9FFF]|[\u3002\uff1b\uff0c\uff1a\u201c\u201d\uff08\uff09\u3001\uff1f\u300a\u300b\uff01])+","g"); return reg.test(str);}其中：[\u4E00-\u9FFF] 用于判断汉字，[\u30
2020-07-16 11:36:48
3123
原创 JavaScript编程题：数组去重
问题题目地址：题目地址为 Array 对象添加一个去除重复项的方法要求是用下面的方式实现：Array.prototype.uniq = function () { }相当于为所有数组对象都添加一个uniq方法。示例输入：[false, true, undefined, null, NaN, 0, 1, {}, {}, ‘a’, ‘a’, NaN]输出：[false, true, undefined, null, NaN, 0, 1, {}, {}, ‘a’]分析数
2020-06-20 10:06:14
498
1
原创 JavaScript编程题：移除数组中的元素
问题题目地址：移除数组元素题目描述移除数组 arr 中的所有值与 item 相等的元素，直接在给定的 arr 数组上进行操作，并将结果返回示例：输入:[1, 2, 2, 3, 4, 2, 2], 2输出:[1, 3, 4]实现function removeWithoutCopy(arr, item) { while (1) { if (arr.includes(item)) { arr.splice(arr.indexOf(item
2020-06-19 12:21:22
219
原创 JavaScript编程题：模块
问题题目地址：模块题目描述完成函数 createModule，调用之后满足如下要求：1、返回一个对象2、对象的 greeting 属性值等于 str1， name 属性值等于 str23、对象存在一个 sayIt 方法，该方法返回的字符串为 greeting属性值 + ', ’ + name属性值实现方法1：function createModule(str1, str2) { let _Class = function(){ this.greeting
2020-06-19 12:11:41
240
原创 JavaScript编程题：流程控制
问题题目地址：流程控制题目描述实现 fizzBuzz 函数，参数 num 与返回值的关系如下：1、如果 num 能同时被 3 和 5 整除，返回字符串 fizzbuzz2、如果 num 能被 3 整除，返回字符串 fizz3、如果 num 能被 5 整除，返回字符串 buzz4、如果参数为空或者不是 Number 类型，返回 false5、其余情况，返回参数 num示例输入：15输出：fizzbuzz实现function fizzBuzz(num) { if (
2020-06-19 11:52:03
218
原创 JavaScript编程题：使用闭包
问题题目地址：使用闭包题目描述实现函数 makeClosures，调用之后满足如下条件：1、返回一个函数数组 result，长度与 arr 相同2、运行 result 中第 i 个函数，即 resulti，结果与 fn(arr[i]) 相同示例输入：[1, 2, 3], function (x) {return x * x;}输出：4实现function makeClosures(arr, fn) { let result = []; for (let
2020-06-19 11:41:23
181
原创 JavaScript创建任意长度的数组
使用Array.from方法和伪数组Array.from({length: 10}) //length属性为数组长度另，可以使用这样的数组形成一个循环for (let i of Array.from({length: 10})) { //some codes here}之前在python里曾经用过这种方法，但是感觉循环次数多的话，就得先生成一个很大的数组才能循环，似乎会耗费些内存和性能。还是中规中矩的循环写法好些。...
2020-06-18 10:01:12
519
原创 算法学习——用JavaScript实现排序算法
var arr = new Array(100);for(let i of arr.keys()) { //生成乱序数组 arr[i] = parseInt(Math.random()*1000);}//sort方法/冒泡排序const sort0 = (arr) => { let sortarr = Array.from(arr); sortarr.sort((x, y) => x - y); console.log(sortarr);}//选择排序
2020-06-03 20:34:44
244
原创 亲历的前端面试题记录
经历了几次面试，也算是一次宝贵的经历吧，把各家公司提问的问题记录下来，希望可以从中给自己或他人带来一点启发。（面试一）领主科技1.是否学习过计算机原理、数据结构？2.vue实现数据绑定的方式？3.vue有哪些常用的指令？v-if、v-show的区别？4.接触过哪些前端框架？5.前公司有几个前端？6.前家公司有哪些上线产品？7.用过哪些数据库？8.ajax组件的运...
2020-03-21 23:09:52
233
原创 JS学习: 不同数据类型常用的API和方法
可以把不同数据类型想象成不同金属，而这些工具组就是我用来对不同金属进行不一样处理的工具（切割、校验、形变、焊合）可以想象，拿到一个数组，你可以对它干嘛（任意处理） 管它有什么用，我就是把它概念成一套工具系统，纸上谈兵 我都不用去想应用场景数组1.创建 Array new Array()1-1.判断类型 Array.isArray()1-2 转换 Array() join()2...
2020-03-09 13:08:25
268
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人