u013262823的博客

git 对于大家肯定都不陌生， 常见的git操作也一定很熟悉。今天和大家介绍的是git 代码合并的时候，使用rebase和merge的区别。其实之前自己一直在用git merge 去合并代码，后来有听说了git rebase ，所以也尝试去了解一下git rebase。正常开发原先有一个test的工程，A在master分支上进行两次操作，并做提交c1和c2。此时A基于master拉了一个分支mywork，mywork是基于c1和c2:A在mywork分支上继续开发，并做了两次提交c3和c4，那么对应

h5分页加载功能的实现项目场景涉及到分页加载，之前文章有用过使用better-scroll 这个插件在进行处理（文章具体地址：https://blog.csdn.net/u013262823/article/details/91979851），今天我们使用滚动的方式来实现分页加载的功能，比起使用better-scroll更简单易懂，我们先介绍一下实现的大致原理：1、监听滚动事件，滚动到距离底部...

普通代码实现滚动 <div class="m-t-20 fz12 m-l-15">普通滚动</div> <div class="scroll-box"> <div class="new-icon"> </div> <div class="n...

浏览器缓存机制解析dns缓存 、cdn缓存 、 浏览器缓存dnsdns的全称为domain name system 域名系统 域名和ip地址映射；dns 解析：通过域名,最终得到该域名对应的IP地址的过程叫做域名解析www.test.aiyi.com.cn(域名) - DNS解析 -> 10.1.201.69 (IP地址)dns缓存：有dns的地方,就有缓存。浏览器、...

函数防抖和接口debounce 函数防抖函数防抖，从字面上理解就是希望函数被频繁调用的时候，在指定时间间隔内，只会被调用一次。throttle 函数节流函数节流，从字面上理解就是希望函数在指定间隔内（按照我们设定的频次）触发一次。其实说白了，函数防抖和函数的节流的最终目的还是为了节省资源。比如防止过于频繁的请求接口服务等等。根据两者特性，我也模拟出一种场景来对两者进行解释。具体场景如下：...

闭包 closure闭包的概念: 闭包就是指有权访问另一个函数作用域中的变量的函数function outer() { var name = 'closure' // 函数内部变量 return function () { return name }}let inner = outer()console.log('inner', inner()) // 'innder', cl...

let arr = [1,3,4,5,6,7,7,8,9,9,9,9,91,1,2,3,3,4,5,‘a’,‘ab’,‘a’,‘abc’,‘abc’]方法一 es6 Setlet list1 = []list1 = Array.from(new Set(arr))console.log(‘methods1’, list1)方法二 遍历循环 indexOflet list2 = []a...

bcryptbcrypt，是一个跨平台的文件加密工具。由它加密的文件可在所有支持的操作系统和处理器上进行转移。它的口令必须是8至56个字符，并将在内部被转化为448位的密钥。（来自百度的定义）使用他的场景主要是: 自己正在搞的一个平台中最基本的用户注册登陆功能，本来一开始没想去考虑安全加密这块（毕竟对于后端的开发还是不太熟悉的），但后来登陆进数据中一看，用户密码赤裸裸的被展示出来，感觉太刺眼了...

经手了一个项目，要求前端实现一个带有农历、节假日、节气的前端日历，类似万年历的样子。当时查了一些资料，都是一些零零散散的，要么就只有农历，要么只有传统节假日，还有一些对于节气的判断，各种语言的都有，看的头大。正好项目所需，就把很多东西结合起来，封装了一个dateTransForm.js 这么一个方法。实现效果如下：首先是日历的实现，之前我有写了一篇文章链接地址如下（https://blog....

vue获取元素高度为0document.getElementsByClassName(‘xxx’)[0].clientHeight获取元素高度在部分异性屏上获取的高度为0（华为novas、pro）日常开发过程中，使用了better-scoll做了上拉加载下拉刷新的功能。由于列表展示使用了absolute定位，为了不遮挡顶部的tab，所以需要做一个top的计算。最先想到的是 let h2 = ...

$refs 定义ref 被用来给元素或子组件注册引用信息。引用信息将会注册在父组件的 $refs 对象上。如果在普通的 DOM 元素上使用，引用指向的就是 DOM 元素；如果用在子组件上，引用就指向组件实例。（摘录自官网）之前在第一篇博客上介绍vue组件通信的时候有介绍过ref，vue中我们经常使用其来实现对进行父子组件的传递使用。<template> <div i...

前端常用接口请求，最先想到的是原生XHR和jquery ajax，通过使用xhr或者jquery ajax实现一个异步的http的请求。明显jquery的出现，原生xhr的已经慢慢被取代。Jquery ajax$.ajax({ type: 'POST', url: url, data: data, dataType: dataType, success: func...

基于canvas的时钟表的实现实现一个简易的时钟表主要包含以下几块内容：1、表盘数字的实现2、秒针功能实现（一秒转动Math.PI2/60 度）3、分针功能实现 (一分钟转动Math.PI2/60 度)4、时针功能实现(一小时转动Math.PI*2/12 度)5、当前具体日期功能实现(new Date())6、通过setInterval设定一个定时器，每隔一秒去获得最新的时间细节提...

canvas手写签名（vue）最近一直在研究canvas的东西，正好之前对手写签名这块有点兴趣。就自己基于vue写了一个简易的手写签名demo。其中原理比较简单，先生成一个canvas画布，并对canvas进行touchstart和touchmove事件进行监听。当监听touchstart事件被触发时，我们开始触发canvas里的beginPath事件并且设置moveTo原始点。当监听touc...

React使用高德地图，之前介绍的方法是使用react-amap基于React进行封装的地图组件。除了使用这种方法，我们也可以直接使用高德原生的方法进行操作。地图插件引入首先script引入这个就不多说了,在项目的html文件里 <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.3&k...

pc版React重构，使用到了高德地图。搜了资料，发现有一个针对React进行封装的地图插件react-amap。官方网址：https://elemefe.github.io/react-amap/components/map，有兴趣的可以看下里面的API。react-amap 安装1、使用npm进行安装，目前是1.2.8版本：cnpm i react-amap2、直接使用sdn方式引入...

前端实现一个上拉加载，下拉刷新，并且滑动一定的位置能够实现回到顶部的功能。这个在移动端上来说是一个很常见的功能。之前有看到有人用bette-scroll库来实现这个功能。最基本的初始化代码如下：import BScroll from 'better-scroll'let wrapper = document.querySelector('.wrapper')let scroll = new...

vue全局样式使用使用vue-cli 脚手架快速构建了机遇webpack的vue项目。在页面开发过程中，我们会写各种各样的css样式。写多了就会想到将相同的css样式变成全局的样式。比如这样的:$color-99: #999;$color-66: #666;$color-ff: #fff;$color-fb: #fbfbfb;$color-ee: #eee;$color-dd: #...

Javascript执行机制介绍简单的javascript试手JavaScript是一门单线程语言node环境javascript执行机制浏览器环境和node环境对比

dateFormat.js 常用日期格式转换const WEEK_ARR = ['周日', '周一', '周二', '周三', '周四', '周五', '周六']export class DateFormat { date constructor(date = new Date()) { this.date = this.getDate(date) ...