自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(95)
  • 收藏
  • 关注

原创 react 实现拖动元素

【代码】react 实现拖动元素。

2023-09-15 14:35:37 381

原创 缓存机制和实现

【代码】缓存机制和实现。

2023-05-22 12:41:22 184

原创 gas 、gas price、 gas limit

【代码】gas 、gas price、 gas limit。

2023-05-09 11:56:09 343

原创 【代码结构优化】嵌套条件判断

【代码】【代码结构优化】嵌套条件判断。

2023-05-05 11:45:35 120

原创 阅读推荐--CSS世界

《CSS世界》张鑫旭大佬CSS三部曲中的第一作 同时也是笔者入行读的第一本书 CSS入手简单,深入难 越到后面就会觉得错综重叠的样式出现不合预期的现象便难以定位。 而这本书将会从表现渗透到本质,从样式的基础结构进行解析. 比如: 对于一个图片浮动,认为只有float起作用,实际上,行高、字体、鼠标手形等都在起作用. 实际上CSS属性和其他多个CSS属性发生着千丝万缕的关系。 多次翻读,多实践此书的内容,至少会让你在CSS上得到一番领悟。

2023-04-07 17:24:44 127

原创 [js方法原理]实现自己的Promise方法

使用原生js实现自己的promise主要功能

2023-03-27 23:48:14 66

原创 阅读推荐--JavaScript高级程序设计(第四版)

红宝书第四版阅读顺序推荐

2023-03-12 14:52:21 232

原创 vue2自定义指令

vue自定义指令为什么v-开头使用

2023-03-11 17:24:06 271

原创 【vue2源码学习】— diff

vue diff算法

2023-03-10 13:00:40 116

原创 【vue2源码学习】— nextTIck

nextTick原理,为什么有时候获取不到dom的解释

2023-03-09 15:52:54 74

原创 【vue2源码学习】— 响应式初始化

vue数据响应式初始化过程和优化点

2023-03-08 18:47:52 189

原创 【vue2源码学习】— 组件使用

全局组件和局部组件

2023-03-08 15:58:24 117

原创 【vue2源码学习】— 生命周期钩子调用时机

vue 生命周期钩子执行位置

2023-03-07 21:08:29 176

原创 【vue2源码学习】— patch

vue组件渲染流程

2023-03-06 18:11:54 142

原创 【vue2源码学习】— 组件节点

vue组件节点处理

2023-03-06 16:06:31 200

原创 【vue2源码学习】— 渲染真实DOM

vue如何渲染真实dom

2023-02-26 17:53:25 237

原创 【vue2源码学习】— createElement

vue createElement发生了什么

2023-02-25 18:57:50 661

原创 【vue2源码学习】— vm._render

vm._render的功能

2023-02-24 18:35:39 180

原创 【vue2源码学习】— 初始化和挂载

vue源码的初始化和挂载流程和生命周期图对照

2023-02-24 17:40:05 467

原创 【vue2源码学习】— 入口

vue2源码学习-Vue本质和构建

2023-02-20 14:54:16 253

原创 【vue2源码学习】— 准备工作

vue2 源码学习准备

2023-02-13 19:59:02 121

原创 桶排序(基数排序)js

桶排序顾名思义,桶是装东西的这里是把需要排序的东西,根据某种映射关系和桶关联起来,再放进去那么桶的选择就非常重要,比如有一个很多大数的数组,我们要用桶排序需要建立若干个桶形成映射,当然这不太合适,所以这种场景下就不要使用桶排序了简单举个例子,就能理解桶排序了假设有个待排序数组:[100,101,045,021]其中个位最大的是是5,建立一个下标能到5的桶[[],[],[],[],[],[]]1.根据个位[[100],[101, 21],[],[],[],[45]]2.从左到右倒出来[1

2021-09-26 02:25:09 93

原创 堆,堆排序js

概念:堆是一个脑补的二叉树既然当作树来看,就满足树的一些特点:某个节点i的左孩子位置在2*i+1右孩子位置在2*i+2父节点位置在i-1/2比如: [1,2,3,4,5]可以看作是一个二叉树,下标是节点,数组中对应的就是值,0是1,1是2,2是3, 3是4, 4是5值2的位置在1,左孩子位置是2*1+1=3 可以拿到4右孩子位置是2*1+2=4 可以拿到5父节点位置在0 可以拿到1大根堆:二叉树中每个子树的最大值都在顶部是每个子树的根节点小根堆:二叉树中每个子树的最小值都

2021-09-23 23:13:49 67

原创 理解快速排序分治法实现js

function quickSort(arr) { if (!arr || arr.length<2) { return } quickSortMain(arr, 0, arr.length-1)}function quickSortMain(arr, L, R) { if (L<R) { // 随机取个值下标的数当作中间值指标,并和最后一个值交换位置 // 交换的目的是方便设置左边界,在midBorder函数中 // Math.random()生成[0,1)的随机

2021-09-13 21:31:11 84

原创 理解归并排序js

function mergeSort(arr, L, R) { // 递归终止条件,到达最小单元,此时单个元素一定有序 if (L===R) { return } // 移位运算符优先级小于+ // 中点下标为(L+R)/2 // 但是L+R可能溢出 // 所以使用 2L/2 + (R-L)/2的形式 // >> 移位符,>>1相当于除以2 // 2的二进制为010 // 右移一位 001 为1 // 6的二进制110 // 右移一位011 为3 //

2021-09-12 22:23:43 111

原创 理解插入排序--js

插入排序是一个O(n^2)的排序算法实现上来说就是维护一个前n个数为有序的序列(当然反过来也可以)例如,排序出一个升序的[6,5,4,3,2,1,0]默认第一个数 6 为有序从5开始往前看5小于6,交换[5,6,4,3,2,1,0]4往前看4小于6,交换[5,4,6,3,2,1,0]继续往前看,直到比他小,或者没有下一个数4小于5,交换[4, 5,6,3,2,1,0]。。。。。。其实这个过程很像打牌时的手牌重组比如:一开始没有手牌发了一张k给我手上只有一张是有序的

2021-09-07 23:45:12 51

原创 react 使用对象创建虚拟dom

一般我们用jsx是通过map数组的形式如const arr = [1,2,3]render(){ return ( <div> { arr.map((ele,idx)=>{ return ( <div key={idx}>{ele}</div> ) }) } </div> )}那如果是一个对象,怎么遍历,创建虚拟dom呢 关键API: Object.keys 参数:要

2021-09-06 19:45:54 131

原创 屏幕适配方案

适配核心–等比概念回顾视口理解:布局视口,视觉视口,理想视口1.viewport适配步骤<meta name = "viewport " content="width=设计稿宽度"/>例如设计稿宽度为375<meta name = "viewport" content="width=375"/>,然后按照设计稿做就行了这样布局视口就一直是375优点: 不需要复杂计算,按照设计稿标注做即可缺点: 不能使用完整的meta标签,会导致安卓手机出现严重兼容问题 导致

2021-09-02 21:06:46 106

原创 视口理解:布局视口,视觉视口,理想视口

在pc端默认宽度和浏览器窗口的宽度一致,在css标准文档中,视口也被称为:初始包含块是所有css百分比宽度推算的根源可以理解成浏览器的屏幕是一个可变的盒子例子:全屏显示时宽度就是屏幕宽度,假设是1000有一个盒子占宽20%则它的宽为200如果把窗口拉到原来的一半,现在是500则盒子占100,即宽为100所以有时候看到浏览器在拉小时内容错位了,就是因为包容的容器盒子变化了一些参考的值显示区域 document.documentElement.clientWidth 常用显示区域 +

2021-09-02 20:50:52 1041

原创 javascript倒计时功能

假设有一个100000000的时间戳那么总共就有100000秒(100000000 / 1000)100000%60 就是去除掉整分钟数 剩下的秒数 就是秒占40100000/60 是整的分钟数 总共1666分钟100000/60%60 是分钟数不到一个小时的部分 为46 占2760 = 4660100000/3600 是整的小时数为27100000/3600%24 是小时数不到一天的部分 这里为3 占10800 = 36060100000/3600/24 是整数天的天数这里为1 占86400

2021-08-24 21:49:02 198

原创 js 继承方式扩展(原型式,寄生式)

温故而知新:js中构造函数,原型,实例的关系,原型链是什么js/javascript 继承方式主要有哪些?及其优缺点特点// 原型式// 概念: 使用已存在的对象创建一个新的对象,而不必创建新的自定义对象类型// 实现方法function inherit(father) { function Tmp() {} // 继承父类的对象(直接把父对象当原型对象) Tmp.prototype = father return new Tmp() /* 回顾new的过程 1.创建了新的对象,

2021-08-24 20:57:08 148

原创 微信小程序 自定义头部导航栏

关键APIgetSystemInfoSyncgetMenuButtonBoundingClientRect链接: getSystemInfoSync.链接: getMenuButtonBoundingClientRect.自定义头部导航栏的适配1.通过getSystemInfoSync获取到statusBarHeight实现状态栏高度(电池等信息的状态栏)2.getMenuButtonBoundingClientRect获取到右上角胶囊的指标(可省略第一步)top: 胶囊顶部到手机顶部的

2021-08-21 01:59:38 318

原创 Taro微信小程序底部动画弹窗

// 蒙层部分@keyframes slideBgUp { from { visibility: visible; background: transparent; } to { background: rgba(0,0,0,.7); }}@keyframes slideBgDown { from { background: rgba(0, 0 ,0 , .7); } to { background: transparent;

2021-08-21 01:46:38 1665 1

原创 微信小程序 调试器看不到子组件的样式

思路因为之前是能看到的所以对比了一下最近两个版本的代码发现主要写了keyframe动画注释掉后发现就能看到了解决方法把keyframe相关的css先注释掉其他可能还有其他的原因共同导致的,如果大家有其他的方法或思路,欢迎一起分享...

2021-08-07 16:15:34 442

原创 Taro学习笔记_发送请求、静态数据引入

import { useState, useEffect } from 'react'import Taro from '@tarojs/taro'import { View, Image } from '@tarojs/components'import './index.less'// 引入图片,不然直接引入(使用src属性)会找不到文件,因为编译后可能出现文件位置变化// static是自己建的目录src/staticimport pic from '../../static/111.jp

2021-07-04 15:17:12 366

原创 Taro学习笔记_路由配置、传参、跳转

路由配置src/app.config.js下的pages属性进行设置谁在第一项打开的页面就在哪里window属性是设置小程序一些样式的使用 taro create xxx 可以快速在pages下创建页面跳转APInavigateTo 页面跳转,可以返回redirectTo 不记录上一页跳转switchTab Tab之间切换,配合Taro的导航栏一起使用navigateBack 返回上一页relaunch 关闭所有页面,打开一个页面getCurrentPages 获得当前页面的一些配置

2021-07-04 15:09:09 1115

原创 Taro学习笔记_写子组件并传参

子组件文件位置/src/pages/index/son.jsx// 这里这是演示,要规范子组件的位置哦import { View, Text } from '@tarojs/components'function Son(props) { return ( <View> <Text>Im son get father value props: { props.por }</Text> </View> )}export defau

2021-07-04 14:55:55 190

原创 Taro学习笔记_使用Hooks和列表渲染

笔者Taro版本v3.2.13文件位置/src/pages/index/index.jsximport { useState } from 'react'import { View, Text } from '@tarojs/components'function Index() { const list = [ { id: 1, name: 'z1'}, { id: 2, name: 'z2'}, { id: 3, name: 'z3'}, { id: 4, name: 'z4

2021-07-04 14:50:52 285

原创 Taro学习笔记_环境搭建

安装注意包管理工具的配置这里说一下yarn的配置npm i yarn -g 全局安装yarn控制台执行 yarn -v 如果打印出了yarn的版本则全局安装yarn成功yarn config list 命令查看yarn的配置把源换成淘宝的yarn config set registry https://registry.npm.taobao.org/设置全局安装目录,找个位置新建一个global文件夹yarn config set global-folder "E:\xx\global

2021-07-04 14:42:29 332

原创 js异步理解(进阶)

之前说了基本的事件循环现在来进一步理解es6中的事件循环Promise是ES6发布的一种异步实现方案如果和setTimeout一起使用的结果是什么呢// promise和setTimeoutPromise.resolve().then( () => { console.log('p1')})setTimeout(()=>{ console.log(4)},0)Promise.resolve().then( () => { console.log('p2')

2021-04-29 15:08:45 184

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除