自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 JS获取浏览器窗口大小 获取屏幕,浏览器,网页高度宽度

网页可见区域宽:document.body.clientWidth网页可见区域高:document.body.clientHeight网页可见区域宽:document.body.offsetWidth (包括边线的宽)网页可见区域高:document.body.offsetHeight (包括边线的宽)网页正文全文宽:document.body.scrollWidth网页正文全文高:document.body.scrollHeight网页被卷去的高:document.body.scrollTop

2021-09-10 10:10:03 463

原创 你了解Vue的响应式原理吗?

⼀、你了解Vue的响应式原理吗?⾸先要了解Vue中的三个核⼼类:1. Observer: 给对象的属性添加 getter 和 setter,⽤于依赖收集和派发更新2. Dep: ⽤于收集当前响应式对象的依赖关系,每个响应式对象包括⼦对象都拥有⼀个 Dep 实例, dep.subs是watcher实例的数组. 当数据有变更时,会通过 dep.notify()通知各个 watcher。3. Watcher: 观察者对象, 实例分为 render watcher(渲染), computed wat

2021-06-08 21:54:40 96

转载 .md常用语法

正文:1、标题的几种写法:第一种: 前面带#号,后面带文字,分别表示h1-h6,上图可以看出,只到h6,而且h1下面会有一条横线,注意,#号后面有空格第二种: 这种方式好像只能表示一级和二级标题,而且=和-的数量没有限制,只要大于一个就行第三种: 这里的标题支持h1-h6,为了减少篇幅,我就偷个懒,只写前面二个,这个比较好理解,相当于标签闭合,注意,标题与#号要有空格那既然3种都可以使用,可不可以混合使用呢?我试了一下,是可以的,但是为了让页面标签的...

2021-04-15 14:09:20 259

原创 React 性能优化完全指南

本文分为三部分,首先介绍 React 的工作流,让读者对 React 组件更新流程有宏观的认识。然后列出笔者总结的一系列优化技巧,并为稍复杂的优化技巧准备了 CodeSandbox 源码,以便读者实操体验。最后分享笔者使用 React Profiler 的一点心得,帮助读者更快定位性能瓶颈。一、React 工作流React 是声明式 UI 库,负责将 State 转换为页面结构(虚拟 DOM 结构)后,再转换成真实 DOM 结构,交给浏览器渲染。当 State 发生改变时,React 会先进

2021-04-01 10:33:02 230

原创 数组方法使用大全

1.arr.push() 从后面添加元素,返回值为添加完后的数组的长度let arr = [1,2,3,4,5]console.log(arr.push(5)) // 6console.log(arr) // [1,2,3,4,5,5]2. arr.pop()从后面删除元素,只能是一个,返回值是删除的元素let arr = [1,2,3,4,5]console.log(arr.pop()) // 5console.log(arr) // [1,2,3,4]3. a.

2021-02-03 17:08:11 245

原创 Vue3的响应式原理学习

Vue2的响应式原理是存在一些缺点 默认会递归、消耗较大 数组响应化需要额外实现 新增/删除属性属性无法监听 Map、Set、Class 等无法响应式,修改语法有限制 而Vue3使用ES6的Proxy特性来解决上面这些问题,本篇文章我将带大家深入了解Vue3的响应式原理并在最后通过Proxy实现其核心逻辑。什么是 Proxy?ES6中我们看到了一个让人耳目一新的属性——Proxy。我们先看一下概念通过调用new Proxy(),你可以创建一个代...

2021-02-01 14:50:28 974

原创 面向对象的特性及继承

1.面向对象的三大特性 封装,继承,多态1.1 原型链是面向对象的基础,2.创建对象有几种方法 2.1 字面量var obj11 = {name: 'smyh'};var obj12 = new Object(name: `smyh`); //内置对象(内置的构造函数) 2.2 通过构造函数var M = function (name) { this.name = name;}var obj3 = new M('smyhvae'); ...

2021-01-29 11:00:50 66

原创 我从 Vuejs 中学到了什么

createApp(App).mount('#not-exist')

2021-01-01 13:10:12 373

转载 浏览器及浏览器内核

任何上过网的用户对浏览器是再熟悉不过了。只是用户看到仅仅只是浏览器本身,却很少能看到浏览器最核心的部分—浏览器内核。从第一款libwww(Library WorldWideWeb)浏览器发展至今已经经历了无数竞争与淘汰了。现在国内常见的浏览器有:IE、Firefox、QQ浏览器、Safari、Opera、Google Chrome、百度浏览器、搜狗浏览器、猎豹浏览器、360浏览器、UC浏览器、遨游...

2019-07-03 16:35:24 785

转载 第三方登录

在主流的APP中,微信快捷登录已经成为了登录体系的标配,我们越来越习惯不去记忆密码,而是点击跳转到微信,再点击授权进入到APP中。我们把这类通过第三方授权授权来登录自家产品的方式,统称为第三方登录。但是有没有好奇,为什么点击一下授权,就完成了登录,如此神奇的功能背后的产品逻辑是什么?嗯,本文就是来解答你的这个疑惑的,围绕第三方登录,讲清三件事情。1.是什么?· 第三方...

2018-10-23 14:25:32 375

原创 正则验证

验证数字:^[0-9]*$验证n位的数字:^\d{n}$验证至少n位数字:^\d{n,}$验证m-n位的数字:^\d{m,n}$验证零和非零开头的数字:^(0|[1-9][0-9]*)$验证有两位小数的正实数:^[0-9]+(.[0-9]{2})?$验证有1-3位小数的正实数:^[0-9]+(.[0-9]{1,3})?$验证非零的正整数:^\+?[1-9][0-9]*$...

2018-09-04 11:20:00 312

转载 vue数据请求loading

一般项目中,有时候会要求,你在数据请求的时候显示一张gif图片,然后数据加载完后,消失。这个,一般只需要在封装的axios中写入js事件即可。当然,我们首先需要在app.vue中,加入此图片。如下:app.vue<template> <div id="app"> <loading v-show="fetchLoading"></loa...

2018-08-21 13:16:50 1404

原创 vue绑定checkbox改变选中状态

<div class="weui-cells weui-cells_checkbox font14" v-for="item in items"> <label class="weui-cell weui-check__label"> <div class="weui-cell__ft width-inherit"&am

2018-08-21 11:52:42 19578 1

转载 vue axios 请求loading

1.在src文件夹里面找到main.js文件2.在main.js中引入axios,引入mint-ui        import Axios from 'axios';        import Mint from 'mint-ui';        Vue.use(Mint);3.发起请求,打开loading        //请求拦截器        Axios.i...

2018-08-15 10:22:38 1609

原创 vue页面动态切换

Vue-router结合transition实现app前进后退动画切换效果首先,配置路由并且修改路由配置配置路由的重点是给Router添加一个goBack方法,用于记录路由的前进状态 this.isBack = trueRouter.prototype.goBack = function () {   this.isBack = true  window.history.go(-1...

2018-08-15 09:59:29 2066

翻译 变态的面试题

  一、 村子里有100对夫妻,其中每个丈夫都瞒着自己的妻子偷情。村里的每个妻子都能立即发现除自己丈夫之外的其他男人是否偷情,唯独不知道她自己的丈夫到底有没有偷情。村里的规矩不容忍通奸。任何一个妻子,一旦能证明自己的男人偷情,就必须当天把他杀死。村里的女人全都严格照此规矩办事。一天,女头领出来宣布,村里至少有一个丈夫偷情。请问接下来会发生什么事 答案:这是一个典型的递归问题。一...

2018-08-02 14:27:16 955

原创 angularjs关于点击复制input文本内容兼容苹果和安卓问题总结

移动端点击按钮复制链接,由于input自带的select()方法在苹果端无法进行选择    所以设置如下方法进行点击复制<input name="" type="text" class="text" ng-model="inviteLink" readonly="" id="clip_num" value=""> <input

2018-06-07 15:42:42 716

原创 angular UI框架

基于Angular的UI框架:NG-ZORRO NG-ZORRO是AntDesign的Angular实现,NG-ZORRO由阿里计算平台事业部、阿里云等不同部门的一些小伙伴在原业务组件的基础上共同构建而成,而且已开源,现在是0.6.0的版本,组件功能已经很齐全了,更符合我们国人使用习惯,已兼容Angular 5.0版本。是目前为止我见过的最全面、最好、最符合国人使用习惯的管理后台angular 2...

2018-04-08 14:50:10 12138 4

原创 angular5来袭

    Angualr是一款来自谷歌的开源的web前端框架,诞生于2009年,由Misko Hevery 等人创建,后为Google所收购。是一款优秀的前端JS框架,已经被用于Google的多款产品当中。根据项目数统计angular(1.x 、2.x 、4.x、angular5.x)是现在网上使用量最大的框架。Angular5新增了很多新特性。    2015之前Angular1.x得到了广泛的应...

2018-02-27 16:51:15 348

原创 键盘事件

前端开发中为提高用户的体验会设置键盘事件第一:指令介绍ng-keyup 指令用于告诉 AngularJS 在指定 HTML 元素上按键松开时需要的操作。ng-keyup 指令不会覆盖元素的原生 onkeyup 事件, 事件触发时,ng-keyup 表达式与原生的 onkeyup 事件将都会执行。按键敲击的事件顺序:KeydownKeypr

2018-01-12 11:39:47 170

原创 第一篇CSDN博客

纪念开通了CSDN,纪念一下这一天学习前端几年,感觉自己知道了一些东西,但是又感觉什么都不懂,所以决定在这里记录自己的学习过程,学到的每个知识点与大家一起分享,从简单到复杂,去细化自己的知识结构,让思路更加清晰。从基础,到高级,学习的东西越来越多,发现要学的东西更多,沉浸在这知识的海洋中,有时候不能自拔了,哈哈,我都快信了第一:布局静态页面第二:实现页面动态效果(DOM,BOM

2018-01-12 09:31:14 133

空空如也

空空如也

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

TA关注的人

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