JavaScript函数柯里化
函数柯里化柯里化的定义
红宝书(第三版): 用于创建已经设置好了一个或多个参数的函数。基本使用方法是使用一个闭包返回一个函数。(P604)
维基百科:柯里化(英语:Currying), 是把接受多个参数的函数变换成接受一个单元参数(最初函数的第一个参数)的函数,并且返回接受余下的参数而且返回结果的新函数的技术。(原链接)
官方解释看得有点懵,大白话概述一下:
柯里化技术,主要体现在函数里返回函数。 就是将多变量函数拆解为单变量(或部分变量)的多个函数并依次调用。
再直白一点:利用闭包,可以形成一个不销毁的私有作用域,把预先处理的内容都存在这个不销毁的作用域里面,并且返回一个函数,以后需要执行的就是这个函数。
PS: 如果还是不理解也没关系,跟闭包一样不用死扣定义,继续往下面看应用就行了。
柯里化的作用柯里化有三个常见应用:
参数复用- 当在多次调用同一个函数,并且传递的参数大多数是相同的,那么该函数可能是一个很好的柯里化候选
提前返回- 多次调用多次内部判断,可以直接把第一次判断的结果返回外部接收
延迟计算/运行- 避免重复的去执行程序,等真正需要结果的时候再执行
应用一: 参数 ...
js 事件循环
为什么JavaScript是单线程的?单线程意思就是说同一个时间只能做一件事。那这样的话效率不是很低?也没有啦,其实JavaScript的单线程特点是跟他的用途有关的。作为浏览器脚本语言,JavaScript的主要用途是与用户互动,以及操作DOM。假如不是单线程话,在一个线程当我们在给某个DOM节点增加内容的时候,另一个线程正在删除这个DOM节点的内容,那还得了,那不是乱套了吗。所以JavaScript只能是单线程
虽然JavaScript是单线程,但是JavaScript中有同步和异步的概念,解决了js阻塞的问题。同步和异步一.同步如果在一个函数返回的时候,调用者就能得到预期结果(即拿到了预期的返回值或者看到了预期的效果),那么这个函数就是同步的。
用代码解释一下:
1console.log('hello word')
如果在函数返回时,就看到了预期效果:在控制台打印了 hello word
二.异步如果在函数返回的时候,调用者还不能得到预期结果,而是需要在将来通过一定的手段得到,那么这个函数就是异步的。
代码解释:
123fs.readFile('te ...
markdown语法手册附快捷键
一、标题 ctrl/⌘+序号1.基础语法123456# 一级标题## 二级标题### 三级标题#### 四级标题##### 五级标题###### 六级标题
效果展示
2.带目录的标题可以在标题前加“@TOC”生成标题目录
效果展示
二、文本编辑1.斜体 Ctrl /⌘+I1*斜体* 或者 _斜体_
2.粗体 Ctrl /⌘+B1**加粗** 或者 __加粗__
3.标记1==标记==
4.引用 Ctrl/⌘+Shift+Q1> 引用
5.删除 Alt+Shift+51~~删除~~
6.上标110^-5^
7.下标1A~xy~
效果展示
三、列表1.有序列表 Ctrl/⌘+Shift+[1231. 有序列表项12. 有序列表项23. 有序列表项3
注意:这里是“序号.”+“空格”+“内容”
2.无序列表 Ctrl/⌘+Shift+]123- 无序列表项 * 无序列表项 + 无序列表项
注意:这里- * + 没有特殊要求,在生成无序列表中是等价的,看个人喜好即可。
3.相关操作快捷键
增加缩进:Ctrl/⌘+] - 减少缩进: ...
requestAnimationFrame api说明
requestAnimationFrame,读懂这篇文章就够了requestAnimationFrame 请求动画帧它是一个浏览器的宏任务
requestAnimationFrame的用法与settimeout很相似,只是不需要设置时间间隔而已。requestAnimationFrame使用一个回调函数作为参数,这个回调函数会在浏览器重绘之前调用。它返回一个整数,表示定时器的编号,这个值可以传递给cancelAnimationFrame用于取消这个函数的执行
requestAnimationFrame特点【1】requestAnimationFrame会把每一帧中的所有DOM操作集中起来,在一次重绘或回流中就完成,并且重绘或回流的时间间隔紧紧跟随浏览器的刷新频率,如果系统绘制率是 60Hz,那么回调函数就会16.7ms再 被执行一次,如果绘制频率是75Hz,那么这个间隔时间就变成了 1000/75=13.3ms。换句话说就是,requestAnimationFrame的执行步伐跟着系统的绘制频率走。它能保证回调函数在屏幕每一次的绘制间隔中只被执行一次,这样就不会引起丢帧现象,也不会导致 ...
面试问题总结
1. 父子组件生命周期执行顺序 Vue的父子组件钩子函数的执行顺序可以归类为4个部分
第一部分:首次加载渲染
父beforeCreate -> 父crearted -> 父 beforeMount -> 子 beforeCreate -> 子 created -> 子 beforeMount -> 子 mounted -> 父 mounted
第二部分:子组件更新
父beforeUpdate -> 子beforeUpdate -> 子updated -> 父 updated
第三部分: 父组件更新- 不会影响子组件
父 beforeUpdate -> 父 updated
第四部分:组件销毁
父 beforeDestroy -> 子 beforeDestory -> 子 destoryed -> 父 destoryed
2. Vue 路由钩子2.1 路由钩子分为三种
全局钩子: beforeEach、afterEach、 beforeResolve
当个组件里面的钩子:before ...
【JS】一个神奇的交叉观察 API IntersectionObserver
前言前端开发肯定离不开判断一个元素是否能被用户看见,然后再基于此进行一些交互。
过去,要检测一个元素是否可见或者两个元素是否相交并不容易,很多解决办法不可靠或性能很差。然而,随着互联网的发展,这种需求却与日俱增,比如,下面这些情况都需要用到相交检测:
图片懒加载——当图片滚动到可见时才进行加载
内容无限滚动——也就是用户滚动到接近内容底部时直接加载更多,而无需用户操作翻页,给用户一种网页可以无限滚动的错觉
检测广告的曝光情况——为了计算广告收益,需要知道广告元素的曝光情况
在用户看见某个区域时执行任务或播放动画
过去,相交检测通常要用到事件监听,并且需要频繁调用 Element.getBoundingClientRect() 方法以获取相关元素的边界信息。事件监听和调Element.getBoundingClientRect() 都是在主线程上运行,因此频繁触发、调用可能会造成性能问题。这种检测方法极其怪异且不优雅。
上面这一段话来自 MDN ,中心思想就是现在判断一个元素是否能被用户看见的使用场景越来越多,监听 scroll 事件以及通过 Element.getBoundi ...
开箱即用,这些 Vue3 后台管理系统模板绝对让你爽歪歪!
开箱即用,这些 Vue3 后台管理系统模板绝对让你爽歪歪!
原文链接:Vue3 后台管理系统模板推荐。
之前写了一篇关于 Vue2 的后台管理系统模板的推荐,详情请见 Vue后台管理系统模板推荐。
Vue3 在今年2月份已成为新的默认版本,本文收集了一些 Vue3 的后台管理系统模板,分享给在座的仌 👣。
还是老规矩,按照 Github 星标数量来依次介绍。
个人较推荐 vue-vben-admin、vue-pure-admin、naive-ui-admin、vue3-composition-admin、vue-next-admin。意见仅供参考,具体可根据团队审美,业务需求选择一款更契合的后台管理系统模板。
gin-vue-admin (14.2k)
如果后台选择的是go语言,可以考虑这一款。
gin-vue-admin(github上的标星数为14.2k)基于 vite + vue3 + gin 搭建的开发基础平台(支持TS,JS 混用),集成 jwt鉴权,权限管理,动态路由,显隐可控组件,分页封装,多点登录拦截,资源权限,上传下载,代码生成器,表单生成器等开发必备功 ...
Vue后台管理系统模板推荐
Vue后台管理系统模板推荐
原文链接: Vue后台管理系统模板推荐
更新记录
2022-08-31
更新 stars 数量,按照 stars 排序。
2021-06-18
新增几款后台管理系统模板。- 注意一点的是,在原基础上直接加在后面(未按starts数排序)。
2021-03-06
推荐一些 Vue 常用后台管理系统模板。
前言Vue.js是一个目前比较流行的前端框架,已经到了前端人人都会的地步,今天这里为大家罗列一下基于 Vue 的后端管理的框架。目前比较流行和 Vue 搭配的 UI组件 有Element-UI、iview、Bootstrap-Vue、Ant-Design-Vue,另外还有Vuetify、 Buefy(Bulma css)、 Vue Material 等等。基于这些组件库封装的后台管理模板,推荐一些常用 VUE后台模板 给大家。按照 星标数量来依次介绍。
vue-element-admin (78.2k)Vue-Element-Admin(github上的标星数为68.6k 78.2k)是一个后台前端解决方案,它基于 ...
uniapp基础知识—大总结
uniapp基础知识—大总结uni-app介绍 官方网页uni-app 是一个使用 Vue.js 开发所有前端应用的框架,开发者编写一套代码,可发布到iOS、Android、H5、以及各种小程序(微信/支付宝/百度/头条/QQ/钉钉)等多个平台。
即使不跨端,uni-app同时也是更好的小程序开发框架。
具有vue和微信小程序的开发经验,可快速上手uni-app
为什么要去学习uni-app?
相对开发者来说,减少了学习成本,因为只学会uni-app之后,即可开发出iOS、Android、H5、以及各种小程序的应用,不需要再去学习开发其他应用的框架,相对公司而言,也大大减少了开发成本。
环境搭建安装编辑器HbuilderX 下载地址
HBuilderX是通用的前端开发工具,但为uni-app做了特别强化。
下载App开发版,可开箱即用
安装微信开发者工具 下载地址
利用HbuilderX初始化项目
点击HbuilderX菜单栏文件>项目>新建 - 选择uni-app,填写项目名称,项目创建的目录
运行项目在菜单栏中点击运行,运行到浏览器,选择浏览器即可运行
在微信开 ...
(干货)CSS实用的60个代码片段
(干货)CSS实用的60个代码片段概述相信大家在写css属性的时候,会遇到一些问题,比如说:垂直对齐,垂直居中,背景渐变动画,表格宽度自适应,模糊文本,样式重置,清除浮动,通用媒体查询,自定义选择文本,强制出现滚动条,固定头部和页脚,自己在网上看到的一篇关于css的文章,感觉这里边一些常用的css代码片段对大家很有帮助,所以我就把这篇文章分享给大家,希望大家能够喜欢。
css代码片段1、垂直对齐如果你用CSS,则你会有困惑:我该怎么垂直对齐容器中的元素?现在,利用CSS3的Transform,可以很优雅的解决这个困惑:
1234567.verticalcenter{ position: relative; top: 50%; -webkit-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%);}
使用这个技巧,从单行文本、段落到box,都会垂直对齐。目前浏览器对Transform的支持是需要关注的,
Chrom ...