前端
zenos_zhou
一只前端小菜鸡,偶尔总结下碰到的问题。
展开
-
前端排序,按照对象数组种某个元素进行排序
import _ from 'lodash'/** * 数据排序 * @param {*} origin 源数据 * @param {*} sortKey 排序的字段 * @param {*} type 排序方式 descending:倒序, ascending:正序 * Rules: 将【pre】和【next】为非零Boolean值【null、undefined、''】的项移到数据最后,不参与正常排序 */function sortByKey(origin, sortKey, typ.原创 2022-03-16 10:37:02 · 1280 阅读 · 2 评论 -
利用函数柯里化判断数据类型
// const curryingDataType = type => data => Object.prototype.toString.call(data) === typeconst curryingDataType = function(type) { return function(data) { return Object.prototype.toString.call(data) === type }}const isObject = c...原创 2021-11-30 09:08:49 · 239 阅读 · 0 评论 -
前端开发常用工具函数
/** * 判断数据类型*/const isObject = data => { return Object.prototype.toString.call(data) === `[object Object]`}const isArray = data => { return Object.prototype.toString.call(data) === `[object Array]`}const isString = data => {...原创 2021-11-12 10:24:06 · 177 阅读 · 0 评论 -
解决JavaScript中 toFixed方法的bug
/** * JavaScript 自带的 toFixed 方法有时候会出现计算不准确的问题 * 例如1.335toFixed(2) = 1.33, 但是实际应用中我们希望得到 1.335toFixed(2) = 1.34 * 重写Number原型对象上的toFixed方法 * 重写之后 1.335toFixed(2) = 1.34*/Number.prototype.toFixed = function(len) { const origin = this let ta...原创 2021-09-28 13:45:59 · 538 阅读 · 0 评论 -
Less中使用循环函数
@bg-color-arr: @bg-bar-01, @bg-bar-02, @bg-bar-03, @bg-bar-04, @bg-bar-05;/* * loop函数,为柱状图的柱子添加背景色 * @index, li的序号 * @len, li的个数 * @color-arr, 柱子的颜色数组 **/.loop(@index, @len, @color-arr) when(@index <= @len) { &:nth-child.原创 2021-08-31 14:02:37 · 594 阅读 · 0 评论 -
JavaScript对象数组中合并某些属性相同的数据项项
/** * 如下图所示,grade为成绩表,成绩表中分别列出了小明和小红的语文、数学和英文的成绩 * 现在需要将小明和小红的成绩合并 * 每条记录包含5个字段,分别是【姓名、年龄、性别、科目、成绩】 * 将姓名、年龄和性别相同的数据合并*/const grades = [ { name: '小明', age: 15, sex: 'male', class: 'Chinese', grade: 80 }, { name: '小明', age: 15, sex: 'male',.原创 2021-08-23 09:43:54 · 3937 阅读 · 1 评论 -
前端开发中按照汉字首字母排序分组
在前端开发过程中,按照汉字首字母排序分组是很常见的操作,比如联系人列表引入第三方插件 npm i --save jian-pinyin原创 2021-06-03 16:20:13 · 4322 阅读 · 0 评论 -
常见的Javascript六种数组扁平化方法
/* 数组扁平化 所谓数组扁平化,也即是将嵌套数组([1, [2, , [3, [4, 5], [6, 7]]]]) 转换成一维数组 ([1, 2, 3, 4, 5, 6, 7])*/// 利用普通递归实现function flatten1(arr) { if (!(arr instanceof Array)) { return false } let newArr = [] for (let i = 0; i < arr.length; i++) { .原创 2021-03-22 10:37:19 · 168 阅读 · 0 评论 -
手写Javascript浅拷贝
const shallowClone = (target) => { if (typeof target === 'object' && target !== null) { const cloneTarget = Array.isArray(target) ? []: {}; for (let prop in target) { if (target.hasOwnProperty(prop)) { cloneTarget[prop.原创 2021-03-21 13:05:47 · 108 阅读 · 0 评论 -
JS快速排序算法
在Javascript中,排序算法是比较常用到的。//快速排序function quickSort(arr) { if (arr.length <= 1) { return arr } const middleIndex = Math.floor((arr.length -1) / 2) const middle = arr.splice(middleIndex, 1)[0] const left = [] const right = [] for (let原创 2021-03-03 17:11:38 · 888 阅读 · 1 评论 -
找出字符串中出现频率最高的字符
1、首先将字符串构造成一个字符频率的对象,字符作为Key,频率作为value2、其次,遍历构造的对象,比对Value,将Value最大的key输出以下代码仅供参考function maxChar(str) { if (str.length === 1) { return str } const tempArr = str.split('') const tempObj = {} // 构造出现字符频率的对象 tempArr.forEach(item =&g.原创 2021-02-28 17:43:55 · 1655 阅读 · 0 评论 -
JavaScript中如何比较两个数组是否相同?
在一次实际项目开发中,有一个位置需要对两个数组内容进行比较,然后很奇怪的发现在JS中直接用 == 和 === 对两个相同的数组做比较时返回的值是false;查看资料发现Array是引用类型数据,而 == 和 === 只能判断这两个数组是否是同一个实例,因此直接比较会返回false;要想比较两个数组是否相同,只能遍历让其每一项进行对比。console.log([1,2] === [1,2])...原创 2018-12-28 19:20:35 · 1395 阅读 · 0 评论 -
父元素为一个div,宽度高度不固定,子元素是一个块状元素,宽高已知,如何实现子元素在父元素内水平、垂直居中?
父元素为一个div,子元素是一个块状元素,宽高已知,如何实现子元素在父元素内水平、垂直居中?1、//利用相对定位,让子元素垂直居中<!DOCTYPE html><html><head> <title></title></head> <style type="text/css"&am原创 2017-10-10 10:37:21 · 2734 阅读 · 0 评论 -
一个台阶总共有n级,如果一次可以跳一级或者两级,求总共有多少种跳法,用任意语言代码实现
台阶问题可以转换成数学问题,即是著名的斐波那契数列。现在我们再来讨论一般情况。我们把n级台阶时的跳法看成是n的函数,记为f(n)。当 n=1 时有 1 种跳法,一次跳一阶当 n=2 时有 2 种跳法,一次跳一阶, 1 1,一次跳二阶 2当n>2时,第一次跳的时候就有两种不同的选择:1:第一次只跳1级,此时跳法数目等于后面剩下的n-1级台阶的跳法数目,即为f(n-1)...原创 2017-11-08 14:17:06 · 3382 阅读 · 0 评论 -
输入一个按照升序排列的数组和一个数字,在数组中查找两个数,使得他们的和正好是输入的那个数字,要求时间复杂度是O(n),如果有多对数字的和等于输入的数字,输入任意一对即可。
已知数组是升序,定义两个下标i,j分别指向数组的第一项和最后一项,将已知数字n和数组中下标i和j的和进行比较,如果n大于i和j的和,则将j自减往前移动一个;如果n小于i和j的和,则将i自加往后移动一位;如此循环比较直到找到满足条件的数或者i >= j为止。function getSum(arr,n){ let i = 0; let j = arr.length-1; while(...原创 2017-11-03 14:51:42 · 936 阅读 · 0 评论 -
如何使用HTML&CSS写一个三角形。
<style type="text/css"> #mydiv{ height: 0px; width: 0px; border-left: 50px solid transparent; border-right: 50px solid transparent; border-bottom: 10...原创 2017-10-10 09:41:29 · 11185 阅读 · 0 评论