- 博客(54)
- 收藏
- 关注
RSS订阅原创 初识Vue3
为什么要使用 ref？当你在模板中使用了一个 ref，然后改变了这个 ref 的值时，Vue 会自动检测到这个变化，并且相应地更新 DOM。这是通过一个基于依赖追踪的响应式系统实现的。当一个组件首次渲染时，Vue 会追踪在渲染过程中使用的每一个 ref。然后，当一个 ref 被修改时，它会触发追踪它的组件的一次重新渲染。
2023-09-11 23:40:40
324
原创 浅谈webpack
本质上，webpack是一个用于现代 JavaScript 应用程序的静态模块打包工具。当 webpack 处理应用程序时，它会在内部从一个或多个入口点构建一个依赖图(dependency graph)，然后将你项目中所需的每一个模块组合成一个或多个bundles，它们均为静态资源，用于展示你的内容。
2023-09-08 16:44:42
491
原创 Web存储
使用HTML5可以在本地存储用户的浏览数据。早些时候,本地存储使用的是 cookie。但是Web 存储需要更加的安全与快速. 这些数据不会被保存在服务器上，但是这些数据只用于用户请求网站数据上.它也可以存储大量的数据，而不影响网站的性能。数据以 键/值 对存在, web网页的数据只允许该网页访问使用。
2023-09-07 22:15:06
611
原创 天气插件和antv图表组件库的使用
G2Plot 是一套简单、易用、并具备一定扩展能力和组合能力的统计图表库，基于图形语法理论搭建而成，"G2Plot"中的 G2 即意指图形语法 (the Gramma of Graphics)，同时也致敬了 ggplot2。
2023-08-28 17:08:40
368
原创 什么是高度塌陷？
在文档流中，父元素的高度默认是被子元素撑开的，也就是子元素多高，父元素就多高。但是当为子元素设置浮动以后，子元素会完全脱离文档流，此时将会导致子元素无法撑起父元素的高度， 导致父元素的高度塌陷。 由于父元素的高度塌陷了，则父元素下的所有元素都会向上移动，这样将会导致页面布局混乱
2023-08-19 12:10:34
112
原创 Vue插槽 、自定义指令、render函数、过滤器和插件
普通插槽，具名插槽，作用域插槽插槽允许我们在调用子组件的时候为子组件传递模板。 元素作为承载分发内容的出口。 一个不带 name 的 出口会带有隐含的名字“default”。父级模板里的所有内容都是在父级作用域中编译的；子模板里的所有内容都是在子作用域中编译的。
2023-08-04 20:27:49
374
原创 Vue 组件
组件 (Component) 是 Vue.js 最强大的功能之一。组件可以扩展HTML元素，封装可重用的代码。在较高层面上，组件是自定义元素，Vue的编译器为它添加特殊功能。在有些情况下，组件也可以表现为用is特性进行了扩展的原生 HTML 元素。组件注册的时候需要为该组件指定各种参数。因为组件是可复用的 Vue 实例，所以它们与 new Vue 接收相同的选项，例如 data、computed、watch、methods 以及生命周期钩子等。仅有的例外是像 el 这样根实例特有的选项。
2023-07-28 22:50:56
241
原创 vue事件绑定、事件参数、事件修饰符、表单双向绑定、监听器、计算属性
事件绑定可以用 v-on 指令监听DOM 事件，并在触发时运行一些 JavaScript 代码。表单可以用 v-model 指令在表单 、 及 元素上创建双向数据绑定。watch(监听器 监听属性)当需要在数据变化时执行异步或开销较大的操作时，使用监听器是最有用的computed（计算属性）只在相关响应式依赖发生改变时它们才会重新求值。
2023-07-23 19:45:01
825
原创 Vue简介、生命周期、模版语法、条件渲染、列表渲染、style和class绑定
Vue是一套用于构建用户界面的渐进式框架。与其他大型框架不同的是，Vue被设计为可以自底向上逐层应用。Vue的核心库只关注视图层，不仅容易上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue也完全能够为复杂的单页应用提供驱动。用来做单页面应用--index.html,页面跳转用的vue插件路由来实现跳转。
2023-07-20 18:30:04
198
原创 ES6 Generator和Promise
Generator是ES6提供的一种异步编程解决方案，语法不同于普通函数；简单的把Generator 理解为一个状态机，封装了多个内部状态。执行Generator 函数会返回一个迭代器对象，可以通过调用迭代器next依次遍历Generator函数内部的每一个状态。Promise是一种异步编程解决方案，Promise是一个容器，保存着将来才会执行的代码；从语法角度来说Promise是一个对象，可以用来获取异步操作的消息。异步操作，同步解决，避免了层层嵌套的回调函数，可以链式调用降低了操作难度。
2023-07-18 18:54:18
473
原创 ES6迭代器、Set、Map集合和async异步函数
迭代器（Iterator）就是这样一种机制。它是一种接口，为各种不同的数据结构提供统一的访问机制。任何数据结构只要部署Iterator接口，就可以完成遍历操作（即依次处理该数据结构的所有成员）。Set类似于数组，但是成员的值都是唯一的，没有重复的值。Set 本身是一个构造函数，用来生成 Set 数据结构。Set 构造函数可以接受一个数组（或者具有 iterable 接口的其他数据结构）作为参数，用来初始化。
2023-07-16 14:15:23
852
原创 ES6类-继承-Symbol-模版字符串
在javascript语言中，生成实例对象使用构造函数；ES6提供了类Class这个概念，作为对象的模板。定义一个类通过class关键字，ES6的类可以看成是构造函数的另一种写法。class可以通过extends关键字实现继承，子类可以没有构造函数，系统会默认分配。子类提供了构造函数则必须要显式调用super。super函数类似于借用构造函数。类似于Animal.call()。ES6引入的一种新的原始数据类型Symbol，表示独一无二的值。Symbol函数可以接受参数，表示对于这个唯一值的描述。
2023-07-15 19:40:04
785
原创 ES6基础语法
解构ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值，这被称为解构，解构的本质属于“模式匹配”，只要等号两边的模式相同，左边的变量就会被赋予对应的值。如果解构不成功，变量的值就等于undefined。
2023-07-11 20:48:58
518
原创 ECMAScript6和其常量变量的声明
ECMAScript(简称ES)的几个重要版本ES6是一个泛指，含义是 5.1 版以后的 JavaScript 的下一代标准，涵盖了 ES2015、ES2016、ES2017 等，ES6 的第一个版本，在 2015 年 6 月发布了正式名称就是《ECMAScript 2015 标准》（简称 ES2015）。ES6在ES5的基础上拓展了很多新特性。
2023-07-10 16:17:50
410
原创 Ajax简介和实例
AJAX = 异步 JavaScript 和 XML。AJAX 是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。传统的网页（不使用 AJAX）如果需要更新内容，必需重载整个网页面。
2023-07-08 13:15:35
595
原创 DOM事件机制(事件流、事件委托、事件类型)以及BOM
HTML DOM 允许 JavaScript 对 HTML 事件作出反应。JavaScript 能够在事件发生时执行，比如当用户点击某个 HTML 元素时。 JavaScript与HTML之间的交互是通过事件实现的。事件就是文档或浏览器窗口中发生的一些特定的交互瞬间。
2023-07-05 22:21:38
453
原创 DOM“文档对象模型”
DOM是JS操作网页的接口，全称为“文档对象模型”（Document Object Model）。它的作用是将网页转为一个JS对象，从而可以用脚本进行各种操作（比如增删内容）。
2023-07-05 18:05:24
274
原创 面向对象之创建对象模式和继承模式
从前面的学习可以知道创建单个对象有两种方法，一种是直接使用字面量 var obj = {},另一种则是使用构造函数 var obj = new Object() 来创建单个对象的。那么，多个对象又如何创建呢？接下来，将介绍四种创建多个对象的方法。
2023-07-04 17:04:05
153
原创 面向对象的程序设计
在 ES 中，数据的分类分为基本数据类型和引用类型。而基本包装类型，严格来说不属于上面两个中的任意一个，但是又和这两种类型息息相关。基本数据类型和引用类型这两个类型其中一个很明显的区别是，引用类型有自己内置的方法，也可以自定义其他方法用来操作数据，而基本数据类型不能像引用类型那样有自己的内置方法对数据进行更多的操作。但基本数据类型真的没有吗？
2023-07-02 12:04:33
171
原创 正则表达式
正则表达式（英语：Regular Expression，在代码中常简写为regex、regexp或RE）使用单个字符串来描述、匹配一系列符合某个句法规则的字符串搜索模式。搜索模式可用于文本搜索和文本替换。验证是否为11位有效手机号码 以1为开头,第二位为3，4，5，7，8中的任意一位,最后以0-9的9个整数结尾密码验证匹配密码，必须包含大写，小写和数字,和特殊字符(!,@,#,%,&),且大于6位
2023-06-28 19:17:27
122
原创 JS之闭包
简单讲，闭包就是指有权访问另一个函数作用域中的变量的函数。MDN 上面这么说闭包（closure）是一个函数以及其捆绑的周边环境状态（词法环境）的引用的组合。换而言之，闭包让开发者可以从内部函数访问外部函数的作用域。在 JavaScript 中，闭包会随着函数的创建而被同时创建。闭包产生条件：1.嵌套函数。2.函数内部存在对函数外部变量的引用。3.变量不会被回收机制回收 缓存变量。创建闭包最常见方式，就是在一个函数内部创建另一个函数。
2023-06-28 17:15:00
71
原创 函数的基本知识
函数允许我们封装一系列代码来完成特定任务。当想要完成某一任务时，只需要调用相应的代码即可。方法（method）一般为定义在对象中的函数。JavaScript 使用关键字function定义函数。函数可以通过声明定义，也可以是一个表达式。作用域中本身没有这个变量 但是想要获取到该变量对应的值作用域链 自由变量沿着作用域逐层向上寻找的过程构成了作用域链/*** 作用域链 自由变量沿着作用域逐层向上寻找的过程构成了作用域链* 自由变量 作用域中本身没有这个变量 但是想要获取到该变量对应的值*/
2023-06-26 19:34:34
75
原创 数组API的重构（shift、unshift、forEach、every、some、filter、map）、数组去重的方法、扁平化数组的方法以及返回字符串最长单词的长度/最长单词
数组API的重构（shift、unshift、forEach、every、some、filter、map）、数组去重的方法、扁平化数组的方法以及返回字符串最长单词的长度/最长单词
2023-06-23 15:36:06
206
原创 数组API之操作方法、位置方法和迭代方法
数组API之操作方法concat、slice、splice，位置方法indexOf、lastIndexOf和迭代方法every、some、forEach、filter、map
2023-06-23 14:32:23
82
原创 数组API之数组序列化、构造函数的静态方法、栈和队列的方法和数组排序方法
序列化的定义、数组API之数组序列化、构造函数的静态方法、栈和队列的方法和数组排序方法
2023-06-23 13:48:11
288
原创 数组的创建、数组部分API以及练习
ECMAScript数组是有序列表，是存放多个值的集合。 有以下特性： 每一项都可以保存任何类型的数据。 数组的大小是可以动态调整。 数组的length属性：可读可写，可以通过设置length的值从数组的末尾移除项或向数组中添加新项.
2023-06-19 19:51:29
78
原创 隐式转换和显式转换
隐式转换和显示转换基本数据类型隐式转换、引用数据类型隐式转换。显式转换将其他类型转为string类型、boolean类型、number类型
2023-06-18 14:21:45
130
原创 算术运算符、一元运算符、赋值运算符、比较运算符、逻辑运算符
操作数放到typeof的后面，会返回当前操作数的类型，对于数值类型可以准确返回，对于引用类型，Function会返回'function'，其他都只会返回'object'。当一个操作数为数字字符串时，除了“+”外都会将数字字符串转换为数字进行运算，这里涉及隐式转换，我们后面再讲。如果两个操作数第一个是假的 返回第一个操作数 null "" NaN false undefined 假的操作数。经常被用作条件判断时的取反操作，类型判断等，还可以用'!或者操作数 如果第一个操作数是假的 返回第二个操作数。
2023-06-15 19:57:19
127
原创 浅谈深拷贝和浅拷贝
对于引用数据类型的成员变量，比如成员变量是数组、某个类的对象等，浅拷贝就是引用的传递，也就是将成员变量的引用（内存地址）复制了一份给新的成员变量，他们指向的是同一个事例。在一个对象修改成员变量的值，会影响到另一个对象中成员变量的值。对于引用数据类型的成员变量，深拷贝申请新的存储空间，并复制该引用对象所引用的对象，也就是将整个对象复制下来。对于基本数据类型的成员变量，浅拷贝直接进行值传递，也就是将属性值复制了一份给新的成员变量。引用数据类型的特点：存储的是该对象在栈中引用，真实的数据存放在堆内存里。
2023-06-15 15:10:47
62
原创 初识JS/JavaScript及其数据类型
1.ECMAScript 核心js 基础语法和内置对象函数。2.DOM(Document Object Model)文档对象模型。3.BOM(Browser Object Model)浏览器对象模型。js是一门函数优先，具有原型编程的一门需要解释器解析的编程语言。
2023-06-15 09:13:16
97
原创 CSS-animation动画案例
由于该技术的规范还没有稳定，在使用前要先确保浏览器对其兼容性。Animations是css3的一个模块，使用keyframes定义如何随着时间的移动改变CSS的属性值，可以通过指定它们的持续时间，重复次数，如何重复来控制关键帧的行为。Animations由两部分组成：css动画的配置，以及一系列的keyframes（用来描述动画的开始、过程、结束状态）。不需要了解任何Js技术即可完成动画的制作。
2023-06-14 20:01:56
190
原创 使用CSS过渡-Transitions实现图片手风琴效果
transition：property duration timing-function delay
2023-06-13 16:55:12
344
原创 css实现水平垂直居中的方法
水平垂直居中的方法：方法(1)通过margin属性，方法(2)通过padding属性，方法(3)“子绝父相”，方法(4)flex弹性盒子
2023-06-08 17:00:16
200
原创 相对定位、绝对定位和固定定位
相对定位就是相对于自己以前在标准流中的位置来移动。绝对定位就是相对于body来定位。绝对定位在这里分两种情况：(1)父元素没有或者没设置相对定位，相对于浏览器视口区域进行定位。(2)父元素设置了相对定位，相对于父元素/祖先元素进行定位。固定定位可以让某个盒子不随着滚动条的滚动而滚动。
2023-06-08 16:20:45
366
原创 什么是外边距塌陷以及BFC是什么？（12）
外边距合并，即外边距塌陷。BFC全称：Block Formatting Context，即块级格式化上下文。
2023-06-06 17:36:54
70
原创 盒子属性和盒子模型(11)
IE盒子宽:width=contentWidth+paddingLeft+paddingRight+borderLeft+borderRight。盒子的高:height+paddingTop+paddingBottom+borderTop+borderBottom。盒子的宽:width+paddingLeft+paddingRight+borderLeft+borderRight。盒子所占页面宽:盒子宽+marginLeft+marginRight。其中width是设置给盒子本身的。
2023-06-06 16:45:13
67
原创 CSS中Overflow属性(10)
overflow是CSS的简写属性，其设置了元素溢出时所需的行为——即当元素的内容太大而无法适应它的块级格式化上下文时。
2023-06-06 11:28:45
47
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人