- 博客(128)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 移动web自测
theme: channing-cyan一.H5移动web开发1.H5 的新特性有哪些？C3 的新特性有哪些？H5新特新拖拽释放 (Drap and drop) API ondrop拖放是一种常见的特性，即抓取对象以后拖到另一个位置,在 HTML5 中，拖放是标准的一部分，任何元素都能够拖放自定义属性 data-id语义化更好的内容标签 (header,nav,fo...
2022-11-04 17:22:33
153
原创 防抖节流函数
theme: channing-cyan跟着coderwhy学习1.认识防抖和节流函数我们用一副图来理解一下它的过程：当事件触发时，相应的函数并不会立即触发，而是会等待一定的时间；当事件密集触发时，函数的触发会被频繁的推迟；只有等待了一段时间也没有事件触发，才会真正的执行响应函数；防抖的应用场景很多： + 输入框中频繁的输入内容，搜索或者提交信息； ...
2022-08-29 09:41:56
156
原创 解决 windows安装依赖或运行项目 报错
theme: channing-cyan起因今天从gitte上拉了一下，路佬刚完成的一个基于Vue2全栈教务系统项目-模拟实现支付服务的一个项目，想着来学习一下，然后..对，没错刚开始装完依赖就遇到一个关于node版本的问题，顺便记录一下。1.报错信息error eslint-plugin-vue@8.5.0: The engine "node" is incompatible...
2022-08-13 22:36:43
241
原创 从0快速掌握webpack
theme: channing-cyan一.创建项目废话不多说，直接开始初始化一个weboack的项目yarn init -yyarn add webpack webpack-cli --dev项目目录：二.测试新建一些文件夹和文件按，随便写点东西```html// src/index.jsconsole.log("webpack");// ind...
2022-08-13 22:23:31
102
原创 尝鲜ECMAScript2022（ES13）
theme: channing-cyan前言：最近，听到大佬们说ES13出了新特新，本菜鸡也来尝尝鲜部分新特性一.at 方法1.1 说明数组和字符串等都有该方法1.2 功能：用来做通过索引查询的，比如 arr[0] 这是数组的第一个元素，那么查询最后一个，我们原来通常会 arr[arr.length-1],现在可以直接 arr.at[-1],当然你也可以使用-2等等...
2022-08-08 11:15:20
59
原创 Vue3造轮子--Tab组件
theme: condensed-night-purple 前言： 前言:在写Tab组件时，写的笔记，记录一下学习过程~Tab组件一.Dialog需求分析1. 参考一下别人的对话框AntD还可以参考 Bulma、Element、iView、Vuetify等2.需求点击 Tab 切换内容有一条横线在动二.API设计Tabs组件怎么使用...
2022-07-23 23:33:43
105
原创 Vue3造轮子--Dialog组件
theme: condensed-night-purple 前言： 前言:在写Dialog组件时，写的笔记，记录一下学习过程~Dialog组件一.Dialog需求分析与API设计1. 参考一下别人的对话框AntD还可以参考 Bulma、Element、iView、Vuetify等2. 需求点击后弹出有遮罩层 overlay有 close 按钮有标...
2022-07-23 23:22:07
67
原创 Vue3造轮子--Button组件
theme: condensed-night-purple 前言:在写Button组件时，写的笔记，记录一下学习过程~一.Vue3 属性绑定默认所有属性都绑定到根元素使用inheritAttrs: false可以取消默认绑定使用$attrs或者context.attrs获取所有属性使用v-bind="$attrs"批量绑定属性使用const {size, level...
2022-07-16 09:28:03
59
原创 Vue3造轮子--Switch组件
theme: condensed-night-purple一.Switch 组件1.有什么问题？ 最大的问题：外界无法知道当前状态是开还是关解决：添加 value 属性， 添加 input 事件html <Switch :value="xxx" @input="x = $event"/>2.如何让Switch 接受 value用 props ...
2022-07-13 18:26:05
66
原创 CSS居中方法总结
theme: condensed-night-purplehighlight: agate 前言：本文记录文本居中、水平居中、垂直居中、万能居中方法以及绝对居中方法，若有错误还请指正！1.文本居中+height + line-height：两者配合使用，垂直方向居中+ text-align：父级的 text-align，水平方向居中 注意：text-align：...
2022-07-03 19:11:34
39
原创 Echarts基础配置记录
theme: channing-cyan前言：这两天学习和看了echarts文档，觉得很酷炫，就尝试写了个可视化大屏的小项目。源码地址：https://gitee.com/boheweb/echarts-demoEcharts-基础配置echarts九大配置信息title：标题组件tooltip: 提示狂组件legend: 图例组件toolbox： 工具栏grid...
2022-06-20 10:37:19
47
原创 CSS-HTML 知识点
知识点梳理选择器的权重和优先级 盒模型 盒⼦⼤⼩计算 margin 的重叠计算 浮动float 浮动布局概念 清理浮动 定位position ⽂档流概念 定位分类 fixed 定位特点 绝对定位计算⽅式flex布局 如何实现居中对⻬？ 理解语义化 CSS3 动画 重绘和回流选择器的权重和优先级CSS 选择器有很多， 不同的选择器的权重和优...
2022-06-01 13:37:28
53
原创 JS-Web-API 知识点
除ES基础之外，Web前端经常会⽤到⼀些跟浏览器相关的API知识点梳理BOM操作DOM操作事件绑定Ajax存储BOMBOM(浏览器对象模型)是浏览器本身的⼀些信息的设置和获取，例如获取浏览器的宽度、高度，设置让浏览器跳转到哪个地址。+ navigator+ screen+ location+ history这些对象就是⼀堆⾮常简单粗暴的API，去MD...
2022-05-29 15:40:00
55
原创 ES 基础知识点总结（一）
知识点梳理变量类型JS的数据类型分类和判断值类型和引⽤类型原型与原型链(继承)原型和原型链定义继承写法作⽤域和闭包执⾏上下⽂this闭包是什么异步同步vs异步异步和单线程前端异步的场景ES6/7新标准的考查箭头函数ModuleClassSet和MapPromise变量类型JavaScript是⼀种弱类型脚本语⾔，所谓弱类型指...
2022-05-27 23:21:49
64
原创 深度学习Deep Learning--安装记录
theme: condensed-night-purple 前言：本片文章只是浅记录一下学习课程中安装过程我用的到软件与环境：+ Miniconda+ Python3.6+ jupyter notebook+ vscocdeWindows用户第一次运行需要完整完成一下5个步骤。如果是再次运行，可以忽略前面3个步骤的下载和安装，直接跳转到第四步和第五步1.根据操...
2022-05-27 17:06:37
66
原创 《网络设备配置与管理》部分总结与复习
theme: condensed-night-purplehighlight: androidstudio《网络设备配置与管理》复习当你在穿山越岭的另一边，我在孤独的路上没有尽头。 注意：本人上课时做的笔记，结合课本以及个人理解，总结的比较零乱难免会有错误。交换机的工作原理CAM表：记录的是端口号和MAC地址端口连交换机 MAC连PC以集线器的工作的方...
2022-05-14 15:29:48
173
原创 BOM-DOM
theme: channing-cyan跟着coderwhy学习1.认识BOMJavaScript有一个非常重要的运行环境就是浏览器，而且浏览器本身又作为一个应用程序需要对其本身进行操作，所以通常浏览器会有对应的对象模型(BOM，Browser Object Model)。我们可以将BOM看成是连接JavaScript脚本与浏览器窗口的桥梁。BOM主要包括一下的对象模型：...
2022-03-26 11:58:33
44
原创 JSON-数据存储
theme: channing-cyan跟随coderwhy学习1.JSON的由来在目前的开发中，JSON是一种非常重要的数据格式，它并不是编程语言，而是一种可以在服务器和客户端之间传输的数据格式。JSON的全称是JavaScript Object Notation(JavaScript对象符号)：JSON是由Douglas Crockford构想和设计的一种轻量级资料交换...
2022-03-24 21:27:24
66
原创 包管理工具详解 npm、yarn、cnpm、npx
theme: channing-cyan跟随coderwhy学习1.代码共享方案在JavaScript中可以通过模块化的方式将代码划分成一个个小的结构：在以后的开发中我们就可以通过模块化的方式来封装自己的代码，并且封装成一个工具；这个工具我们可以让同事通过导入的方式来使用，甚至你可以分享给世界各地的程序员来使用；如果我们分享给世界上所有的程序员使用，有哪些方式呢？方式...
2022-03-21 18:39:18
65
原创 JavaScript模块化（二）
theme: channing-cyan跟着coderwhy学习1.认识 ES ModuleJavaScript没有模块化一直是它的痛点，所以才会产生我们前面学习的社区规范：CommonJS、AMD、CMD等，所以在ES推出自己的模块化系统时，大家也是兴奋异常。ES Module和CommonJS的模块化有一些不同之处：一方面它使用了import和export关键字；另一...
2022-03-20 18:07:42
47
原创 异常处理-CommJS模块化解析（一）
theme: channing-cyan1.错误处理方案开发中我们会封装一些工具函数，封装之后给别人使用：在其他人使用的过程中，可能会传递一些参数；对于函数来说，需要对这些参数进行验证，否则可能得到的是我们不想要的结果；很多时候我们可能验证到不是希望得到的参数时，就会直接return：但是return存在很大的弊端：调用者不知道是因为函数内部没有正常执行，还是执行结果就...
2022-03-19 19:12:56
76
原创 await-async-事件循环（二）
theme: channing-cyan跟着coderwhy学习1.Node的事件循环浏览器中的EventLoop是根据HTML5定义的规范来实现的，不同的浏览器可能会有不同的实现，而Node中是由libuv实现的。这里给出一个Node的架构图：我们会发现libuv中主要维护了一个EventLoop和worker threads(线程池)；EventLoop负责调用系统的...
2022-03-18 18:41:46
40
原创 await-async-事件循环
theme: channing-cyan跟着coderwhy学习1.异步函数 async functionasync关键字用于声明一个异步函数：async是asynchronous单词的缩写，异步、非同步；sync是synchronous单词的缩写，同步、同时；async异步函数可以有很多中写法：```jsasync function foo1() {}...
2022-03-17 19:59:10
35
原创 迭代器Iterator-生成器Generator
theme: channing-cyan跟着coderwhy学习1.什么是迭代器？迭代器(iterator)，是确使用户可在容器对象(container，例如链表或数组)上遍访的对象，使用该接口无需关心对象的内部实现细节。其行为像数据库中的光标，迭代器最早出现在1974年设计的CLU编程语言中；在各种编程语言的实现中，迭代器的实现方式各不相同，但是基本都有迭代器，比如Jav...
2022-03-14 18:01:08
41
原创 Promise的设计结构与手写（二）
theme: channing-cyan跟着coderwhy学习1.Promise结构的设计Promise规范 https://promisesaplus.com/```jsconst PROMISESTATUSPENDING = 'pending'const PROMISESTATUSFULFILLED = 'fulfilled'const PROMISESTATU...
2022-03-13 11:49:31
43
原创 Promise的使用和类方法（二）
theme: channing-cyan跟着coderwhy学习1.then方法 – 接受两个参数then方法是Promise对象上的一个方法：它其实是放在Promise的原型上Promise.prototype.thenthen方法接受两个参数：fulfilled的回调函数：当状态变成fulfilled时会回调的函数；reject的回调函数：当状态变成reject时会...
2022-03-12 14:26:18
162
原创 响应式原理-Promise的使用详解（一）
theme: channing-cyan跟着coderwhy学习1.对象的依赖管理我们目前是创建了一个Depend对象，用来管理对于name变化需要监听的响应函数：但是实际开发中我们会有不同的对象，另外会有不同的属性需要管理；我们如何可以使用一种数据结构来管理不同对象的不同依赖关系呢？在前面刚刚学习过WeakMap，并且在学习WeakMap的时候我讲到了后面通过Weak...
2022-03-11 19:08:29
46
原创 Proxy-Reflect-认识响应式（一）
theme: channing-cyan跟着coderwhy学习1. 监听对象的操作先来看一个需求：有一个对象，我们希望监听这个对象中的属性被设置或获取的过程通过我们前面所学的知识，能不能做到这一点呢？其实是可以的，我们可以通过之前的属性描述符中的存储属性描述符来做到；监听对象的操作左边这段代码就利用了前面讲过的 Object.defineProperty 的存储属性描...
2022-03-10 17:30:26
41
原创 ES7-ES12知识点解析和应用
theme: channing-cyan跟着coderwhy学习1.ES7 - Array Includes在ES7之前，如果我们想判断一个数组中是否包含某个元素，需要通过 indexOf 获取结果，并且判断是否为 -1。在ES7中，我们可以通过includes来判断一个数组中是否包含一个指定的元素，根据情况，如果包含则返回 true，否则返回false。```jsc...
2022-03-08 13:43:11
35
原创 ES6知识点详细解析
theme: channing-cyan跟着coderwhy学习1.字符串模板基本使用在ES6之前，如果我们想要将字符串和一些动态的变量(标识符)拼接到一起，是非常麻烦和丑陋的(ugly)。ES6允许我们使用字符串模板来嵌入JS的变量或者表达式来进行拼接：首先，我们会使用 `` 符号来编写字符串，称之为模板字符串；其次，在模板字符串中，我们可以通过 ${expressi...
2022-03-07 15:05:38
40
原创 ES6-语法解析-let-const等
theme: channing-cyan跟随coderwhy学习1.字面量的增强ES6中对 对象字面量 进行了增强，称之为 Enhanced object literals(增强对象字面量)。字面量的增强主要包括下面几部分：属性的简写：Property Shorthand方法的简写：Method Shorthand计算属性名：Computed Property Nam...
2022-03-06 15:11:26
42
原创 继承的实现-对象-函数-原型的关系
theme: channing-cyan跟着coderwhy学习1.对象的方法补充hasOwnProperty + 对象是否有某一个属于自己的属性(不是在原型上的属性)```jsvar obj = { name: 'mint', age: 18}var info = Object.create(obj, { address: { ...
2022-03-05 16:19:43
38
原创 JS原型链和继承
theme: channing-cyan跟着coderwhy学习1.JavaScript中的类和对象当我们编写如下代码的时候，我们会如何来称呼这个Person呢？在JS中Person应该被称之为是一个构造函数；从很多面向对象语言过来的开发者，也习惯称之为类，因为类可以帮助我们创建出来对象p1、p2；如果从面向对象的编程范式角度来看，Person确实是可以称之为类的；``...
2022-03-03 18:43:15
38
原创 对象补充-原型和函数原型-创建对象
theme: channing-cyan跟随coderwhy学习1.创建多个对象的方案如果我们现在希望创建一系列的对象：比如Person对象包括张三、李四、王五、李雷等等，他们的信息各不相同；那么采用什么方式来创建比较好呢？目前我们已经学习了两种方式：new Object方式；字面量创建的方式；这种方式有一个很大的弊端：创建同样的对象时，需要编写...
2022-03-02 15:40:26
28
原创 with-eval-严格模式-面向对象（一）
theme: channing-cyan跟着coderwhy学习1.with语句with语句 扩展一个语句的作用域链。```jsvar obj = {name: "hello world",age: 18}with(obj) { console.log(name) console.log(age)}```+ 不建议使用with语句，因为它可能...
2022-03-01 20:29:02
46
原创 this绑定规则细节和面试题分析
theme: channing-cyan跟着coderwhy学习1.实现apply、call、bind实现一下apply、call、bind函数：注意：实现是练习函数、this、调用关系，不会过度考虑一些边界情况实现pkcall```js// 给所有的函数添加一个 pkcall 的方法Function.prototype.pkapply = function (t...
2022-02-28 16:03:38
31
原创 JS函数的this指向
theme: channing-cyan跟着coderwhy学习1.为什么需要this？在常见的编程语言中，几乎都有this这个关键字(Objective-C中使用的是self)但是JavaScript中的this和常见的面向对象语言中的this不太一样：常见面向对象的编程语言中，比如Java、C++、Swift、Dart等等一系列语言中，this通常只会出现在类的方法中。...
2022-02-27 17:07:03
28
原创 函数执行-作用域连-面试题-内存管理
theme: channing-cyan跟着coderwhy学习1.认识内存管理不管什么样的编程语言，在代码的执行过程中都是需要给它分配内存的，不同的是某些编程语言需要我们自己手动的管理内存，某些编程语言会可以自动帮助我们管理内存：不管以什么样的方式来管理内存，内存的管理都会有如下的生命周期：第一步：分配申请你需要的内存(申请)；第二步：使用分配的内存(存放一些东西，比如...
2022-02-26 14:52:40
27
原创 浏览器原理-v8引擎-js执行原理
theme: channing-cyan跟随coderwhy学习1.浏览器工作原理思考： JavaCscript代码，再浏览器是如何被执行的？2.认识浏览器内核我们经常会说:不同的浏览器有不同的内核组成Gecko:早期被Netscape和Mozilla Firefox浏览器浏览器使用;Trident:微软开发，被IE4~IE11浏览器使用，但是Edge浏览...
2022-02-26 14:52:25
51
原创 学习打卡-HTML5+CSS3基础（二）
theme: channing-cyan菜鸡打卡1.在一个页面中给多个元素设置相同的 id, 会导致什么问题?会导致通过 js 获取 dom 元素的时候, 只能获取到第一个元素, 后面的元素都无法正常获取.2.用伪类实现一个上三角?```html.triangleborderup{ border:20px solid red; border-top:...
2022-02-24 13:30:06
50
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人