自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 vue3.0学习笔记(三)——计算属性、监听器、ref属性、组件通信

计算属性应该是只读的,特殊情况可以配置 get set核心步骤:导入computed 函数执行函数在回调参数中return 基于响应式数据做计算的值,用变量接收。

2024-07-24 22:25:19 351

原创 vue3.0学习笔记(二)——生命周期与响应式数据(ref,reactive,toRef,toRefs函数)

组合API的生命周期钩子有7个,可以多次使用同一个钩子,执行顺序和书写顺序相同。

2024-07-22 22:40:39 743

原创 vue3.0学习笔记(一)——vue3简介与vite脚手架的使用

vite是什么?

2024-07-21 23:22:20 759

原创 vue学习笔记(十一)——开发心得(axios的封装、promise细节、vue-router开发中的使用)

1.1 为什么要封装api?代码分层,便于以后的修改,无需触碰逻辑页面根地址并使用默认导出将 axios 导出。每个模块中,只允许使用唯一的一次 export default,否则会报错!统一管理所有需要的url地址,封装网络请求的方法并导出。如在 api 目录下新建 home.js 用于统一管理首页 Home 组件中的所有网络请求index.js接口API 后缀。

2024-07-20 21:05:24 883 1

原创 vue学习笔记(十)——Vuex(状态管理,组件间共享数据)

mutations是一个对象,对象中存放修改state的方法。

2024-07-19 21:03:03 923

原创 EventLoop、宏任务和微任务

JavaScript 把异步任务又做了进一步的划分,异步任务又分为两类,分别是:①宏任务异步 Ajax 请求、文件操作其它宏任务②微任务Promise.then、.catch 和 .finally其它微任务2.2 宏任务和微任务的执行顺序每一个宏任务执行完之后,都会检查是否存在待执行的微任务, 如果有,则执行完所有微任务之后,再继续执行下一个宏任务。

2024-07-06 15:37:58 695

原创 Promise学习笔记

注意:第 5 行代码中的 new Promise() 只是创建了一个形式上的异步操作。async/await 是 ES8(ECMAScript 2017)引入的新语法,用来简化 Promise 异步操作。在 async/await 出现之前,开发者只能通过链式 .then() 的方式处理 Promise 异步操作。示例代码如下:.then 链式调用的优点: 解决了回调地狱的问题.then 链式调用的缺点: 代码冗余、阅读性差、不易理解。

2024-07-05 23:09:25 701

原创 ES6模块化学习

ES6 模块化规范是浏览器端与服务器端通用的模块化开发规范。它的出现极大的降低了前端开发者的模块化学习成本,开发者不需再额外学习 AMD、CMD 或 CommonJS 等模块化规范。ES6 模块化规范中定义:每个 js 文件都是一个独立的模块导入其它模块成员使用 import 关键字向外共享模块成员使用 export 关键字4. 在 node.js 中体验 ES6 模块化node.js 中默认仅支持 CommonJS 模块化规范。

2024-07-05 22:27:00 698

原创 vue学习笔记(九)——Vue-Router(路由系统)

二级路由往后path直接写名字,无需 / 开头。

2023-12-03 16:13:57 274

原创 vue学习笔记(八)——Vue组件-进阶(插槽、自定义指令)

准备MyTable.vue组件 – 内置表格, 传入数组循环铺设页面, 把对象每个内容显示在单元格里准备UseTable.vue – 准备数据传入给MyTable.vue使用例子:我想要给td内显示图片,需要传入自定义的img标签在MyTable.vue的td中准备占位,但是外面需要把图片地址赋予给src属性,所以在slot上把obj数据绑定。

2023-11-27 22:39:33 172

原创 vue学习笔记(七)——购物车案例及开发中的一些心得体会

props: [] - 只声明变量, 不能类型校验props: {} - 声明变量和校验类型规则 - 不对则报错父组件定义属性子组件接收父组件传的值。

2023-11-27 12:40:23 193

原创 Ajax学习笔记(一)——服务器的基本概念与初识Ajax

Ajax 的全称是 Asynchronous Javascript And XML(异步 JavaScript 和 XML)。通俗的理解:在网页中利用 XMLHttpRequest 对象和服务器进行数据交互的方式,就是Ajax。

2023-11-19 16:54:28 62

原创 vue学习笔记(六)——axios的使用和$refs和$nextTick使用

axios 是一个专门用于发送ajax请求的库官网:特点支持客户端发送Ajax请求支持服务端Node.js发送请求支持Promise相关用法支持请求和响应的拦截器功能自动转换JSON数据axios 底层还是原生js实现,内部通过Promise封装的什么是ajax?一种前端异步请求后端的技术ajax原理?浏览器window接口的XMLHttpRequestaxios是什么?基于原生ajax+Promise技术封装通用于前后端的请求库。

2023-11-19 15:09:19 219

原创 ES6和ES5函数对象语法细节

,// es6 允许简写(对象 key 遇到 es5 函数),省略 :function},// 箭头函数。

2023-11-19 11:52:56 46

原创 vue学习笔记(五)——生命周期

Vue生命周期。

2023-11-17 12:00:06 37

原创 vue学习笔记(四)——vue组件基础

① 父组件内,绑定自定义事件和事件处理函数语法:@自定义事件名="父methods里函数名"② 子组件内,恰当的时机,触发父给我绑的自定义事件,导致父methods里事件处理函数执行什么时候使用子传父技术?当子想要去改变父里的数据子传父如何实现?父组件内,给组件@自定义事件="父methods函数"

2023-11-15 15:34:41 52

原创 vue学习笔记(三)——vue基础(过滤器、计算属性、侦听器)

过滤器只能用在,插值表达式和v-bind动态属性里Vue中的过滤器场景字符串翻转, "输入hello, world", 输出"dlrow ,olleh”字母转大写, 输入"hello", 输出"HELLO”语法:

2023-11-08 14:57:12 71

原创 vue学习笔记(二)——vue基础(更新监测, key作用)

更新监测和key。

2023-11-07 16:44:00 138

原创 vue学习笔记(一)——vue基础(vue/cli、vue指令)

vue/cli是Vue官方提供的一个全局模块包(得到vue命令), 此包用于创建脚手架项目脚手架是为了保证各施工过程顺利进行而搭设的工作平台。

2023-11-06 21:31:34 207

原创 webpack学习笔记——模块打包工具

问题1: webpack既然是个模块包,需要下载吗?问题2: 在一个文件夹里下载包? 需要不需要有人记录呢?初始化文件夹包环境, 得到package.json文件base为环境名字(可以随便取名字,包名),author为项目作者下载webpack等模块包-D 将安装的 webpack 和 webpack-cli 两个包记录到开发环境中在package.json自定义命令, 为打包做准备 配置文档: webpack配置文档问题: 打包后的js能不能应用于网页上呢? 配置文档: webpack-plugin插

2023-11-05 20:25:46 154

原创 ES6学习笔记(八)——性能优化(节流与防抖)

防抖(debounce)所谓防抖,就是指触发事件后在 n 秒内函数只能执行一次,如果在 n 秒内又触发了事件,则会重新计算函数执行时间(英雄联盟英雄回城,如果被打断了,只能重新B回城)北京买房政策:需要连续5年的社保,如果中间有一年断了社保,则需要从新开始计算比如,我 2020年开始计算,连续交5年,也就是到2024年可以买房了,包含2020年。但是我 2024年断社保了,整年没交,则需要从2025年开始算第一年往后推5年… 也就是 2029年才能买房…

2023-11-01 22:38:41 62

原创 ES6学习笔记(七)——异常处理与处理this(改变this指向)

1.1 throw 抛异常异常处理是指预估代码执行过程中可能发生的错误,然后最大程度的避免错误的发生导致整个程序无法继续运行总结:throw 抛出异常信息,程序也会终止执行throw 后面跟的是错误提示信息Error 对象配合 throw 使用,能够设置更详细的错误信息1.2 try/catch 捕获错误信息我们可以通过try / catch 捕获错误信息(浏览器提供的错误信息) try 试试 catch 拦住 finally 最后总结:try...catch 用于捕获错误信息。

2023-11-01 11:06:19 242

原创 ES6学习笔记(六)——深拷贝与浅拷贝

直接赋值和浅拷贝有什么区别?直接赋值的方法,只要是对象,都会相互影响,因为是直接拷贝对象栈里面的地址浅拷贝如果是一层对象,不相互影响,如果出现多层对象拷贝还会相互影响浅拷贝怎么理解?拷贝对象之后,里面的属性值是简单数据类型直接拷贝值如果属性值是引用数据类型则拷贝的是地址。

2023-10-31 17:07:16 759

原创 ES6学习笔记(五)——深入面向对象(原型对象、对象原型、原型链)

一、编程思想一、编程思想1.1 面向过程编程就是分析出解决问题所需要的步骤,然后用函数把这些步骤一步一步实现,使用的时候再一个一个的依次调用就可以了。面向过程,就是按照我们分析好了的步骤,按照步骤解决问题。1.2 面向对象编程 (oop)面向对象是把事务分解成为一个个对象,然后由对象之间分工与合作。面向对象是以对象功能来划分问题,而不是步骤。在面向对象程序开发思想中,每一个对象都是功能中心,具有明确分工。面向对象编程具有灵活、代码可复用、容易维护和开发的优点,更适合多人合作的大型软件项目。

2023-10-27 21:14:43 108

原创 ES6学习笔记(四)——构造函数&数据常用函数

1.1创建对象三种方式。

2023-10-26 19:38:28 330

原创 ES6学习笔记(三)——解构赋值

解构赋值是一种快速为变量赋值的简洁语法,本质上仍然是为变量赋值。

2023-10-25 16:21:23 54

原创 ES6学习笔记(二)——函数进阶(箭头函数)

在开发中【使用箭头函数前需要考虑函数中 this 的值】,事件回调函数使用箭头函数时,this 为全局的 window,因此。引入箭头函数的目的是更简短的函数写法并且不绑定this,箭头函数的语法比函数表达式更简洁。arguments 的作用是动态获取函数的实参。函数提升与变量提升比较类似,是指函数在声明之前即可被调用。① ... 是语法符号,置于最末函数形参之前,用于获取。DOM事件回调函数为了简便,还是不太推荐使用箭头函数。② 借助 ... 获取的剩余实参,是个。箭头函数不会创建自己的this,

2023-10-24 17:47:23 107

原创 ES6学习笔记(一)——作用域(闭包)

垃圾回收机制(Garbage Collection) 简称 GCJS中内存的分配和回收都是自动完成的,内存在不使用的时候会被垃圾回收器自动回收。正因为垃圾回收器的存在,许多人认为JS不用太关心内存管理的问题。但如果不了解JS的内存管理机制,我们同样非常容易成内存泄漏(内存无法被回收)的情况。

2023-10-24 15:17:02 167

原创 JavaScript学习笔记(六)——BOM(Window对象)

标签天生自带的属性 比如class id title等,可以直接使用点语法操作。

2023-10-23 21:12:16 173

原创 子盒子在父盒子水平垂直居中的方法

1.设置父盒子上边框,避免外边距塌陷问题。设置水平方向margin为auto,让子盒子在父盒子上水平居中;垂直方向margin移动父盒子高度的一半减去1像素。子盒子垂直方向移动自身高度的一半。2.使用flex布局实现。

2023-10-23 09:15:28 28

原创 JavaScript学习笔记(五)——DOM(二)

时间对象。

2023-10-18 20:11:21 52

原创 JavaScript学习笔记(四)——DOM

文档对象模型)是用来呈现以及与任意 HTML 或 XML文档交互的API白话文:DOM是浏览器提供的一套专门用来。

2023-10-16 16:01:15 84

原创 JavaScript学习笔记(三)——函数和对象

可用性的代码范围。

2023-10-10 16:02:13 39

原创 JavaScript学习笔记(二)

运算符。

2023-10-09 20:45:54 40

原创 JavaScript学习笔记(一)

未定义是比较特殊的类型,只有一个值 undefined。

2023-10-07 22:39:08 30

原创 WEB前端学习笔记(十二)——移动WEB(响应式布局+bootstrap)

能够根据设备宽度的变化,设置差异化样式开发常用写法媒体特性常用写法max-widthmin-width。

2023-09-28 11:44:46 232

原创 WEB前端学习笔记(十一)——移动WEB(移动适配rem+vw/vh)

px单位或百分比布局无法实现,px单位是绝对单位。手机屏幕大小不同,分辨率不同, 如何设置不同的HTML标签字号?思考:在px单位转换到rem单位过程中,哪项工作是最麻烦的?1rem = 1HTML字号大小。当某个条件成立, 执行对应的CSS样式。解决方案:可以通过Less实现。差异化的 CSS 样式。/* 注释内容 */CSS不支持计算写法。2.2 less运算。

2023-09-26 21:36:25 70

原创 WEB前端学习笔记(十)——移动WEB(flex布局)

移动端和PC端网页不同点PC屏幕大,网页固定版心手机屏幕小, 网页宽度多数为100%

2023-09-24 19:45:03 92

原创 WEB前端学习笔记(九)——空间装换+动画

Z轴是视线方向,移动效果应该是距离的远或近, 电脑屏幕是平面,默认无法观察远近效果。空间转换时,为元素添加近大远小、近实远虚的视觉效果。transform: rotateZ(值);transform: rotateX(值);transform: scaleX(倍数);transform: scaleY(倍数);transform: scaleZ(倍数);思考:生活中,同一个物体,观察距离不同,视觉上有什么区别?思考:默认情况下,为什么无法观察到Z轴位移效果?目标:使用scale实现空间缩放效果。

2023-09-23 13:18:27 31

原创 WEB前端学习笔记(八)——字体图标与平面装换

字体图标字体图标展示的是图标,。处理简单的、颜色单一的图片。

2023-09-19 19:39:24 46

空空如也

空空如也

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

TA关注的人

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