- 博客(34)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 前端复习（HTML & CSS & JS）
前言这里是我自己在复习前端知识点时的梳理，以方便自己回过头来重新快速回忆。HTMLHTML5 新语义化标签标签描述<article>定义文档内的文章。<aside>定义页面内容之外的内容。<bdi>定义与其他文本不同的文本方向。<details>定义用户可查看或隐藏的额外细节。<dialog>定义对话框或窗口。<figcaption>定义 <figure>
2020-10-29 22:55:22
326
原创 JS Promise 详细理解过程
学习 Promise 的建议在本人一开始学 Promise 时也是看了很多热门的 Promise 文章讲解，但是说实话很多都是自己吸收不进去的，跌跌撞撞也走了许多弯路，凭借着自己一点点的理解和感悟整理出了这一篇学习和理解 Promise 的文章。我将从我自己理解的角度和过程会详细讲述 Promise 的理解过程。在学习 Promise 时，我认为需要比较扎实和牢固的JS基础，例如要熟悉词法作用域规则、this规则、熟练闭包、熟练使用回调函数。否则学起来可能会不懂和吃力，毕竟学习技术都是一步步一级级上升
2020-09-22 23:15:27
378
原创 你不知道的JS（上卷）——读书笔记8 this全面解析
this全面解析首先，需要找到调用函数的位置，例子代码如下：function foo() { // 调用栈：全局->foo console.log('foo'); bar();}function bar() { // 调用栈：全局->foo->bar console.log('bar'); baz();}function baz() { // 调用栈：全局->foo->bar->baz conso
2020-09-06 21:07:31
246
原创 你不知道的JS（上卷）——读书笔记7 关于this
关于thisfunction identify() { return this.name.toUpperCase();}function speak() { var greeting = 'Hello,我是' + identify.call(this); console.log(greeting);}var me = { name: 'Kyle'}var you = { name: 'Reader'}identify.call(me); //KYL
2020-09-05 20:35:39
129
原创 JS经验积累笔记
这里记录着一些我自己在学JS中的积累var重复声明同一个标识符并不会报错，而且重复声明赋值会覆盖。let重复声明会报错访问一个已经声明的对象的未声明的成员（如window.a），并不会报ReferenceError错误，而是显示underfined。并不是因为隐式自动声明了一个变量成员：console.log(window.a); //underfinedconsole.log(a); //报错：ReferenceError如果window.a时隐式声明了a，那么在之后的log(a)中
2020-09-05 10:20:49
127
原创 你不知道的JS（上卷）——读书笔记6 动态作用域、块作用域的替代方案、this词法
附录A动态作用域大部分语言都是基于词法作用域，JS也是词法作用域词法作用域是在代码编写时就已经确定好了的（取决于代码编写的位置），除了eval和with而动态作用域关心的是函数在何处被调用总结来说，动态作用域的作用域链是基于调用栈的（函数的调用栈），而词法作用域的作用域链是基于作用域的嵌套附录B块作用域的替代方案想要在ES6之前只用块作用域，可以使用catch：try{throw:2;}catch(a){ console.log(a); //2}这段代码虽然可以达到块作用域的效果，
2020-09-04 21:04:43
137
原创 你不知道的JS（上卷）——读书笔记5 作用域闭包
第五章闭包在JS中无处不在，我们需要的是能够识别、理解并能灵活运用它function foo(){ var a = 2; function bar(){ console.log(a); //2 } bar();}在上述代码中，是一个属于闭包的简单例子，但是并不能最好的代表闭包所表现出来的作用，借用书中的一句话：这是闭包吗？技术上来讲，也许是。但根据前面的定义，确切地说并不是。我认为最准确地用来解释bar()对a的引用的方法是词法作用域的查找规则，而这些规则只是闭包的一部分。（但却
2020-09-04 20:35:20
112
原创 你不知道的JS（上卷）——读书笔记4 提升
第四章声明的变量和函数，在编译阶段前，会把声明提升到作用域最前面，例如：a = 2;var a;console.log(a); //2根据提升规则，声明的a变量会提升到最前面，所以打印出的结果是2上述代码可当做如下代码：var a;a = 2;console.log(a);同样，有如下代码：console.log(a); //underfineda = 2;等同于下面代码：var a;console.log(a); //underfineda = 2;
2020-09-03 17:04:20
113
原创 你不知道的JS（上卷）——读书笔记3 函数作用域和块作用域
第三章函数中的作用域众所周知，JS中的函数可以当做一个作用域，在该作用域里面定义着标识符（变量）以及函数，函数作用域之间又可以嵌套。函数作用域的含义是指，属于这个函数的全部标识符都可以在整个函数的范围内使用以及复用（包括在嵌套的作用域中），这种设计能充分利用JS的动态特性（静态类型语言在编译时便已确定变量的类型，而动态类型语言的变量类型要到程序运行的时候，待变量被赋予某个值之后，才会具有某种类型）隐藏内部实现把代码片段用一个函数包裹起来（创建新的函数作用域），可以隐藏其在原来该函数位置的访问。好处是
2020-09-02 22:01:56
139
原创 你不知道的JS（上卷）——读书笔记2 词法作用域
第二章词法作用域JS语言是词法作用域（除此之外有的语言是动态作用域），其意思是作用域由你写的代码（变量、块作用域）所在的位置来决定的，在词法分析器处理代码时会保持作用域不变（有些例外情况）由于作用域嵌套的规则，使得找到指定的标识符（变量）需要从当前的作用域开始找，逐级向上进行查找，当查找到变量后便停止查找遮蔽效应：根据刚才规则，只要在里层作用域创建相同名字标识符，就可以使外层作用域的变量不会被访问到。但是由于声明的全局变量会自动成为全局对象（比如window对象）的属性，所以可以直接通过全局对象的属
2020-09-02 18:01:34
111
原创 你不知道的JS（上卷）——读书笔记1 作用域是什么
第一章作用域根据名称来查找变量的一套规则编译传统编译：代码在执行前会经历三个步骤，统称为编译分词/词法分析：把代码分为代码块（词法单元）解析/语法分析：把词法单元（数组）转换成由元素嵌套组成的代表了程序语法的树（抽象语法树AST）代码生成：根据AST生成可执行的代码JS编译：JS的编译过程还包括了性能优化等操作。JS的编译过程发生在代码执行之前，编译后基本上代码立即执行编译过程的参与者：引擎：负责整个JS程序的编译和执行过程编译器：负责语法分析及代码生成作用域：负责收集和维护所
2020-09-02 16:42:27
125
原创 Vuetify组件中常见的v-slot:activator=“{ on, attrs }“是什么意思？
在使用Vuetify组件时，常看到v-slot:activator="{ on, attrs }"以及插槽中的v-bind="attrs" v-on="on"例如：由于之前写代码时少有这种写法而且是第一次遇见，用久了难免想知道是什么意思。因为国内没有相关的问题，于是自己去国外网站上搜了搜然后看了下Vue的文档并加上了自己的理解：新写法首先这个template是v-menu的插槽。v-slot:activator是具名插槽的新写法，旧写法slot="activator"在vue 2.6.0 起被废
2020-07-18 16:52:33
9391
5
原创 如何使网站变成黑白？
今天4月4日，全国哀悼日在此对抗击新冠肺炎疫情斗争牺牲烈士和逝世的同胞表示深切哀悼同时我们也不能忘记学习今天很多网站诸如CSDN、淘宝等都变成了黑白色调，这个是如何实现的呢？如果是图片和背景颜色一个个手动换是非常麻烦的，这个时候我们就需要用到CSS3的滤镜属性：html { filter: grayscale(100%);}通过对根结点html设置黑白滤镜，这样网站就可以全部换为...
2020-04-04 18:50:51
1043
1
原创 踩坑：transform 对 :before和:after无效
解决：只需要在:before或者:after里面加上display:block-inline或者display:block-inline就好了：.test::before{ display:block-inline; //加上block-inline，即可实现transform效果 content: '测试'; transform: translateX(100px);}原因...
2020-03-20 13:36:37
1794
2
原创 微信小程序——使用animate CSS动画库
animate CSS动画库稍作修改的话也是可以用在小程序上面的于是我对其稍做了一些调整以及删去了一些多余的代码节省了挺多空间并做了个小demo方便在小程序上测试效果。（下载地址在最后）展示：下载地址：github地址注：animate.wxss文件在utils文件夹下...
2020-03-16 15:17:29
2759
原创 微信小程序——如何一键换肤
小程序一键换肤不难，在这之前需要了解CSS的 var() 函数方法如下：先在page页面里创建一个包含所有元素的view标签，并为其配置style颜色的数据绑定：js如下：此后我们只需要通过this.setData({})的方法改变data里的color值就可以改变全局的配色了...
2020-03-16 13:02:09
1037
原创 微信小程序——修改Vant组件的样式
在项目开发中有时会遇到修改组件样式的问题，比如想颜色统一协调，字体突出等。虽然Vant在组件里面加入了不少外部样式类供用户修改样式，但还是满足不了需求，我就拿选择器Picker举例子：比如默认的Picker样式是这样的：我如果想修改顶部的文字栏的颜色为绿色并且加粗（取消、选择城市、确认）查看文档，找到了它的顶部样式类说明，给它加样式：结果呢？样式变成了这样：我们发现，组件样式并...
2020-03-16 01:15:53
19081
5
原创 微信小程序——唯美高颜值的四季动画demo
移植了一个四季动画到小程序上面，自己进行了部分结构优化和调整，同时还支持了主动点击切换的功能：春夏秋冬下载地址：我的github地址喜欢的朋友欢迎点个星星或者点个赞哦，是对我最大的支持...
2020-03-15 16:00:28
667
3
原创 Node.js 学习笔记
前言看视频结合做demo，断断续续学了一个月Node.js，在这里贴一下我的Node.js学习笔记，就作为一个学习Node.js的整理和归纳吧简介为什么学Node.js?学Node.js就是学Web服务器开发。从招聘上来讲，具有服务端开发经验会更好Node.js是什么？它是javascript的运行环境，可以解释并执行js代码。一般来说js需要在浏览器的帮助下才能运行，而Node...
2020-03-07 18:47:56
472
原创 obs-studio——安装流程及常见问题（黑屏）
最近学校也开学了，上网课想把视频直接录制下来可是发现没找到什么好用免费的视频录制工具，主要是国内绝大部分的录制软件都要钱，否则只能录几分钟这样子废话少说，上链接：官网下载github链接地址：https://github.com/obsproject/obs-studio该软件优点：免费（真的是全免费，基本上需要的功能都有）可以录制高清（1920X1018）可以录高帧（60帧）...
2020-03-03 16:37:39
4533
2
原创 微信小程序——使用阿里巴巴UI字体库
对于只有一个ui的当然可以直接从阿里巴巴ui库上把UI直接下载下来使用可是对于比较多的ui使用，我还是推荐用UI的字体引用来使用，这样方便灵活，可以更加便捷地修改icon的颜色和大小首先进入阿里巴巴ui库，找到想要的ui，加入购物车收集完自己想要的UI后点击右上角的购物车按钮弹出这个，然后可以新建一个项目名，把收集到的UI放入这个项目中然后跳转到了我的项目的网页，点击下载字体库到本...
2020-03-01 18:00:42
1132
原创 git 常遇到的错误归纳
在这我把我git中遇到的错误收集起来…以后方便查看Changes not staged for commit: (use "git add <file>..." to update what will be committed) (use "git restore <file>..." to discard changes in working direct...
2020-02-28 00:09:43
574
原创 JS 日期格式 YYYY-MM-DD 去掉月份和日期的0
例如2020-02-03使其变为2020-2-3// 日期去掉0dislodgeZero(str) { let strArray = str.split('-'); strArray = strArray.map(function(val) { if (val[0] == '0') { return val = val.slice(1);...
2020-02-26 19:25:23
6184
原创 微信小程序——页面间如何数据传递、传值
在小程序里面页面传值的方式有很多：用缓存存取、设置全局变量存取、页面带参传值等。这里写出一个我比较推荐的方法：页面带参传值，不仅可以传字符串，还可以传对象就拿wx.navigateTo这个Api举例子吧在a页面中：//a页面toBpage(){ let user = 'YulRW'; let password = '123456' wx.n...
2020-02-26 01:03:35
1984
原创 关于Css的选择器 :first-child和:last-child所踩过的坑
做项目时用到了last-child选择器，结果没有出现预期的效果，查了下W3C的文档发现我想的没那么简单。就拿:last-child举例，文档中对其的解释是：指定属于其父元素的最后一个子元素的 p 元素的背景色什么意思呢？我详细说明一下：假如是 div:last-child 那么该选择器最终选择的元素是 ： 对所有div标签的父元素的其最后一个子元素div 设置样式，也就是说，其父元素的最...
2020-02-25 19:20:22
3442
2
原创 微信小程序——px和rpx单位转换
小程序新加了rpx这个单位，它可以根据屏幕宽度进行自适应。但是某些组件属性或者api只接收px单位的数字。文档：所以，根据文档规则，我写了个转换函数： // rpx 转换为 px ，传参类型是数字（Number） rpxTorpx(rpx){ let deviceWidth = wx.getSystemInfoSync().windowWidth; //获取设备...
2020-02-23 16:49:11
1637
1
原创 微信小程序——API接口 Promise化
这里放上个人觉得最舒服的一种Promise化方式：在utils里面新建文件Promise.js//Promise.jsfunction wxPromise(functionName, params) { return new Promise(function(resolve, reject) { wx[functionName]({ ...p...
2020-02-23 00:35:16
2927
2
原创 彻底搞懂公钥、私钥、数字签名和数字证书
看完阮一峰老师讲解《数字签名是什么？》的文章后，还是有点稀里糊涂的不懂。有了很多疑问：公钥和私钥怎么又可以加密又可以解密？公钥是公开的，那么每个人都可以拿到，还有什么安全性可言呢？…于是自己再去各个网站看资料思考，总算是自己弄懂了其中的关系和用处。在这里我写下自己对公钥、私钥以及数字签名的了解。（建议先看阮一峰老师的文章，看不懂再来看这篇，因为那篇文章里面有很多细节没有提到，而这篇讲...
2020-02-06 21:06:55
1470
原创 Javascript 解析微信dat文件 微信图片破解
网上看到有dat文件破解的，不过都是java和python的，没看到有JS的自己有了些兴致，所以打算用JS实现。平台是Node本文按照流程来讲，方便大家理解。如果直接想要实现的代码，请拉到最后。1. 查看加密文件微信的dat图片文件在xxxx/FileStorage/Image目录下先要查看加密的dat文件。直接打开肯定是不行的，因为里面是二进制数据，所以需要一个十六进制器打开。如果用...
2020-02-02 18:27:15
3493
1
原创 vscode插件：函数头部、文件头部块注释
平常在描述函数或文件时自己手打块注释很麻烦强大的插件koroFileHeader为我们提供了便捷的注释条件1.安装 koroFileHeader：打开vscode的插件商店，或者按 Ctrl + Shift + X ，搜索 koroFileHeader 找到并安装2.使用文件头部注释：在文件任何地方按下 window： Ctrl + Alt + i / mac ：Ctrl + c...
2020-01-30 16:49:20
1292
原创 js 已知对象中的每个成员值，如何找到这个成员所在的对象？
比如有{ students: [ { id: 1, name: '张三' }, { id: 2, name: '李四' }, { id: 3, name: '王五' }, { id: 4, name: '孙六' } ]}想要通过id或者name来找到对应的对象，用ES6的数组方法可以实现：let id = ...
2020-01-30 16:25:02
292
原创 javascript js 封装一个简单的异步API，获取异步操作结果
平常在封装一个同步的函数时，我们只需要在函数中 return 结果就可以了。像这样：function fn () { var data = 'hello'; return data;}var data = fn();console.log(data) //输出 ： hello但是，如果像一个函数中有异步操作，需要返回异步操作中的结果该如何返回呢？像下面这种情况：functio...
2020-01-29 14:56:42
602
原创 解决在Node中出现 [Object: null prototype] 的问题
解决办法先说最后的解决办法：之所以会有问题，因为用的是url的旧接口，该接口已经废弃了。应该用新的接口const url = require('url');let obj = new URL('http://test.com/index?name=YulRW&message=ok');console.log(obj);如果路径不完整的话可以这样用const url = req...
2019-12-15 21:10:32
21061
15
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人