- 博客(42)
- 收藏
- 关注
原创 浏览器是如何渲染页面的?
reflow 的本质就是重新计算 layout 树。当进行了会影响布局树的操作后,需要重新计算布局树,会引发 layout。为了避免连续的多次操作导致布局树反复计算,浏览器会合并这些操作,当 JS 代码全部完成后再进行统一计算。所以,改动属性造成的 reflow 是异步完成的。也同样因为如此,当 JS 获取布局属性时,就可能造成无法获取到最新的布局信息。浏览器在反复权衡下,最终决定获取属性立即 reflow。repaint 的本质就是重新根据分层信息计算了绘制指令。
2023-08-08 19:29:22 246
原创 事件循环原理
程序运行需要有它自己专属的内存空间,可以把这块内存空间简单的理解为进程每个应用至少有一个进程,进程之间相互独立,即使要通信,也需要双方同意。
2023-08-08 19:20:12 563
原创 你不知道的 CSS 之包含块
没错,因为我们对 div1 进行了定位,因此它会应用非根元素包含块计算规则的第三条规则,寻找离它最近的 position 的值不是 static 的祖先元素,不过显然 body 的定位方式为 static,因此 div1 的包含块最终就变成了初始包含块。首先 HTML 作为根元素,对应的包含块就是前面我们所说的初始包含块,而对于 body 而言,这是一个 static 定位的元素,因此该元素的包含块参照第一条为 html,以此类推 div1、p1、p2 以及 em1 的包含块也都是它们的父元素。
2023-08-07 16:37:06 171
原创 CSS 属性计算过程
你是否了解 CSS 的属性计算过程呢?上面的 CSS 代码中,p 是元素选择器,color 就是其中的一个 CSS 属性。但是要说 CSS 属性的计算过程,还真的不是很清楚。没关系,通过此篇文章,能够让你彻底明白什么是 CSS 属性的计算流程。
2023-08-07 16:35:46 649 1
原创 前端笔记:微信小程序学习笔记
2017 年度百度百科十大热词之一微信小程序,简称小程序,英文名 Mini Program,是一种不需要下载安装即可使用的应用 (张小龙对其的定义是无需安装,用完即走,实际上是需要安装的,只不过小程序的体积特别小,下载速度很快,用户感觉不到下载的过程小程序刚发布的时候要求压缩包的体积不能大于 1M,,否则无法通过,在2017年4月做了改进,由原来的1M提升到2M;2017年1月9日0点,万众瞩目的微信第一批小程序正式低调上线。详细的使⽤,可以查看官⽹data-*
2023-07-06 10:32:03 2788
原创 Vue2脚手架(vue-cli)相关知识点
组件化编码流程: (1).拆分静态组件:组件要按照功能点拆分,命名不要与html元素冲突。 (2).实现动态组件:考虑好数据的存放位置,数据是一个组件在用,还是一些组件在用: 1).一个组件在用:放在组件自身即可。 2). 一些组件在用:放在他们共同的父组件上(状态提升 (3).实现交互:从绑定事件开始。props适用于: (1).父组件 ==> 子组件 通信 (2).子组件 ==> 父组件 通信(要求父先给子一个函数)
2023-06-21 14:46:35 220
原创 TypeScript知识点完整版
TypeScript 的命令行工具安装方法如下:以上命令会在全局环境下安装 命令,安装完成之后,我们就可以在任何地方执行 命令了。编译一个 TypeScript 文件很简单:我们约定使用 TypeScript 编写的文件以 为后缀,用 TypeScript 编写 React 时,以 为后缀。我们从一个简单的例子开始。将以下代码复制到 中:然后执行这时候会生成一个编译好的文件 :在 TypeScript 中,我们使用 指定变量的类型, 的前后有没有空格都可以。上述例子中,我们用 指定
2023-06-15 17:49:43 162
原创 前端笔记:CSS学习笔记
使用css的属性值在一段时间内平滑的过渡比如,鼠标悬停后,背景色在1s内,由白色平滑的过渡到红色1)指定四个要素:过渡属性,如background、color等过渡所需时间过渡函数,即过渡的速度、方式等过渡延迟时间,表示开始执行的时间2)触发过渡通过用户的行为触发,如点击、悬浮等。
2023-06-08 19:47:35 457
原创 前端笔记:HTML学习笔记
- 1993年,IETF发布HTML1.0版本(Internet工程任务组)。 - 1995年,W3C接管,发布HTML2.0版本(表格布局)。 - 1996年,w3c发布HTML3.2版本。 - 1997年,W3C发布HTML4.0版本。 - 1999年,W3C发布HTML4.01版本(最终使用版)。 - 线路1:XHTML版本(严格版本) - 2000年,W3C发布XHTML1.0版本。 - 2001年,W3C发布XHTML1.1版本。 - 线路
2023-06-08 19:38:44 97
原创 NodeJs学习: 1.4. http 模块
回顾:什么是客户端、什么是服务器?在网络节点中,负责消费资源的电脑,叫做客户端;负责对外提供网络资源的电脑,叫做服务器。http 模块是 Node.js 官方提供的、用来创建 web 服务器的模块。通过 http 模块提供的 http.createServer() 方法,就能方便的把一台普通的电脑,变成一台 Web 服务器,从而对外提供 Web 资源服务。
2022-11-27 16:20:17 88
原创 NodeJs学习: 1.3 path 路径模块
path 模块是 Node.js 官方提供的、用来处理路径的模块。它提供了一系列的方法和属性,用来满足用户对路径的处理需求。path.join() 方法,用来将多个路径片段拼接成一个完整的路径字符串path.basename() 方法,用来从路径字符串中,将文件名解析出来。
2022-11-27 16:18:53 2076
原创 NodeJs学习:1.2 fs 文件系统模块
fs 模块是 Node.js 官方提供的、用来操作文件的模块。它提供了一系列的方法和属性,用来满足用户对文件的操作需求。fs.readFile() 方法,用来读取指定文件中的内容fs.writeFile() 方法,用来向指定的文件中写入内容。
2022-11-27 16:15:56 122
原创 NodeJs学习:1.1 初识 Node.js
Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。Node.js 的官网地址:终端(英文:Terminal)是专门为开发人员设计的,用 于实现人机交互的一种方式。作为一名合格的程序员,我们有必要识记一些常用的终端 命令,来辅助我们更好的操作与使用计算机。
2022-11-27 16:09:45 153
原创 JavaScript高级:5.ES6新语法
ES 的全称是 ECMAScript , 它是由 ECMA 国际标准化组织,制定的一项脚本语言的标准化规范。ES6 实际上是一个泛指,泛指 ES2015 及后续的版本。
2022-11-18 17:46:57 141
原创 JavaScript高级:4.正则表达式
正则表达式(Regular Expression )是用于匹配字符串中字符组合的模式。在 JavaScript中,正则表达式也 是对象。正则表通常被用来检索、替换那些符合某个模式(规则)的文本,例如验证表单:用户名表单只能输入英文字母、数字或者下划线, 昵称输入框中可以输入中文(匹配)。此外,正则表达式还常用于过滤掉页面内容中的一些敏感词(替换),或从字符串中获取我们想要的特定部分(提取)等 。其他语言也会使用正则表达式,本阶段我们主要是利用 JavaScript 正则表达式完成表单验证。在 JavaS
2022-11-17 10:38:54 227
原创 JavaScript高级:函数进阶-3.6 递归(含浅拷贝和深拷贝)
如果一个函数在内部可以调用其本身,那么这个函数就是递归函数。简单理解:函数内部自己调用自己, 这个函数就是递归函数递归函数的作用和循环效果一样由于递归很容易发生“栈溢出”错误(stack overflow),所以必须要加退出条件 return。 // 递归函数 : 函数内部自己调用自己, 这个函数就是递归函数 var num = 1;console . log('我要打印6句话');return;// 递归里面必须加退出条件 } num ++;fn();
2022-11-17 10:31:42 103
原创 JavaScript高级:函数进阶-3.4 高阶函数
是对其他函数进行操作的函数,它接收函数作为参数或将函数作为返回值输出。此时fn 就是一个高阶函数函数也是一种数据类型,同样可以作为参数,传递给另外一个参数使用。最典型的就是作为回调函数。同理函数也可以作为返回值传递回来。
2022-11-17 10:29:29 87
原创 JavaScript高级:函数进阶-3.3 严格模式
JavaScript 除了提供正常模式外,还提供了严格模式(strict mode)。ES5 的严格模式是采用具有限制性JavaScript 变体的一种方式,即在严格的条件下运行 JS 代码。严格模式在 IE10 以上版本的浏览器中才会被支持,旧版本浏览器中会被忽略。消除了 Javascript 语法的一些不合理、不严谨之处,减少了一些怪异行为。消除代码运行的一些不安全之处,保证代码运行的安全。提高编译器效率,增加运行速度。
2022-11-17 10:28:44 233
原创 JavaScript高级:函数进阶-3.2 this
*相同点: **都可以改变函数内部的this指向.**区别点: **call 和 apply 会调用函数, 并且改变函数内部this指向.call 和 apply 传递的参数不一样, call 传递参数 aru1, aru2…形式 apply 必须数组形式[arg]bind 不会调用函数, 可以改变函数内部this指向.**主要应用场景: **call 经常做继承.apply 经常跟数组有关系. 比如借助于数学对象实现数组最大值最小值。
2022-11-17 10:27:49 76
原创 JavaScript高级:函数进阶-3.1.函数的定义和调用
函数 方式 function 关键字 (命名函数)函数表达式 (匿名函数)var fn = new Function('参数1','参数2'..., '函数体')Function 里面参数都必须是字符串格式第三种方式执行效率低,也不方便书写,因此较少使用所有函数都是 Function 的实例(对象)函数也属于对象 // 函数的定义方式 // 1. 自定义函数(命名函数) function fn() {};
2022-11-17 10:26:29 79
原创 JavaScript高级:构造函数和原型-2.3.ES5 中的新增方法
ES5 中给我们新增了一些方法,可以很方便的操作数组或者字符串,这些方法主要包括:数组方法字符串方法对象方法迭代(遍历)方法:forEach()、map()、filter()、some()、every();currentValue:数组当前项的值index:数组当前项的索引arr:数组对象本身迭代(遍历)方法:forEach()、map()、filter()、some()、every();练习:15-filter筛选数组迭代(遍历)方法:forEach()、map()、filter()
2022-11-17 10:23:06 106
原创 JavaScript高级:构造函数和原型-2.2.继承
ES6之前并没有给我们提供 extends 继承。我们可以通过构造函数+原型对象模拟实现继承,被称为组合继承。
2022-11-17 10:19:59 83
原创 JavaScript高级:构造函数和原型-2.1构造函数和原型
在典型的 OOP 的语言中(如 Java),都存在类的概念,类就是对象的模板,对象就是类的实例,但在 ES6之前,JS 中并没用引入类的概念。ES6, 全称 ECMAScript 6.0 ,2015.06 发版。但是目前浏览器的 JavaScript 是 ES5 版本,大多数高版本的浏 览器也支持 ES6,不过只实现了 ES6 的部分特性和功能。在 ES6之前 ,对象不是基于类创建的,而是用一种称为构建函数的特殊函数来定义对象和它们的特征。对象字面量自定义构造函数。
2022-11-15 22:19:47 74
原创 JavaScript高级:JavaScript面向对象-1.3ES6 中的类和对象
constructor() 方法是类的构造函数(默认方法),用于传递参数,返回实例对象,通过 new 命令生成对象实例时,自动调用该方法。在 JavaScript 中,对象是一组无序的相关属性和方法的集合,所有的事物都是对象,例如字符串、数值、数组、面向对象编程我们考虑的是有哪些对象,按照面向对象的思维特点,不断的创建对象,使用对象,指挥对象做事情.现实生活中:万物皆对象,对象是一个具体的事物,看得见摸得着的实物。可以是“对象”,一个数据库、一张网页、一个与远程服务器的连接也可以是“对象”。
2022-11-14 22:01:06 275
原创 JavaScript高级:JavaScript面向对象-1.2类的继承
继承现实中的继承:子承父业,比如我们都继承了父亲的姓。 程序中的继承:子类可以继承父类的一些属性和方法。父类的普通函数。//这个sing方法里面的this 指向的是btn这个按钮,因为这个按钮调用了这个函数。//constructor 里面的this指向的是 创建的实例对象。//that里面存储的是cunstructor中的this。// 2. 类里面的共有的属性和方法一定要加this使用.
2022-11-14 21:57:13 159
原创 JavaScript高级:JavaScript面向对象-1.1面向对象编程介绍
就是分析出解决问题所需要的步骤,然后用函数把这些步骤一步一步实现,使用的时候再一个一个的依次调用就可以了。面向对象编程具有灵活、代码可复用、容易维护和开发的优点,更适合多人合作的大型软件项目。优点:性能比面向对象高,适合跟硬件联系很紧密的东西,例如单片机就采用的面向过程编程。封装、继承、多态性的特性,可以设计出低耦合的系统,使系统 更加灵活、更加易于维护。用面向过程的方法写出来的程序是一份蛋炒饭,而用面向对象写出来的程序是一份盖浇饭。面向过程,就是按照我们分析好了的步骤,按照步骤解决问题。
2022-11-14 21:49:24 73
原创 JavaSE学习之路:Idea小技巧一键生成标准JavaBean(一键生成构造方法和Setter和Getter方法)
1.生成有参和无参构造函数2.生成Getter和Setter方法3.生成toString方法。
2022-11-05 17:07:16 9811 7
原创 JavaSE学习之路:day08-面向对象
类的组成是由属性和行为两部分组成属性:在类中通过成员变量来体现(类中方法外的变量)行为:在类中通过成员方法来体现(和前面的方法相比去掉static关键字即可)类的定义步骤:①定义类②编写类的成员变量③编写类的成员方法public class 类名 {// 成员变量 变量 1 的数据类型 变量 1;变量 2 的数据类型 变量 2;… // 成员方法 方法 1;方法 2;
2022-11-05 15:32:42 80
原创 JavaSE学习之路:day07-综合练习
需求: 机票价格按照淡季旺季、头等舱和经济舱收费、输入机票原价、月份和头等舱或经济舱。 按照如下规则计算机票价格:旺季(5-10月)头等舱9折,经济舱8.5折,淡季(11月到来年4月)头等舱7折,经济舱6.5折。
2022-11-05 15:29:15 150
原创 JavaSE学习之路:day06-方法
方法(method)是程序中最小的执行单元注意:方法必须先创建才可以使用,该过程成为方法定义方法创建后并不是直接可以运行的,需要手动使用后,才执行,该过程成为方法调用public static void 方法名() {// 方法体;}// 方法体;}方法名();method();注意: 方法必须先定义,后调用,否则程序将报错定义格式:参数:由数据类型和变量名组成 - 数据类型 变量名参数范例:int apublic static void 方法名(参数 1) {方法体;
2022-11-02 20:17:20 323
原创 JavaSE学习之路:day04-流程控制语句
循环语句可以在满足循环条件的情况下,反复执行某一段代码,这段被重复执行的代码被称为循环体语句,当反复 执行这个循环体时,需要在合适的时候把循环判断条件修改为false,从而结束循环,否则循环将一直执行下去,形 成死循环。而且,很多时候要通过控制语句的执行顺序来实现我们想要的功能。顺序结构是程序中最简单最基本的流程控制,没有特定的语法结构,按照代码的先后顺序,依次执行,程序中大多数的代码都是这样执行的。 小明的考试成绩,如果用switch,那么需要写100个case,太麻烦了,所以用if简单。
2022-10-29 19:00:32 128
原创 JavaSE学习之路:day03-运算符
- * / % 这些操作跟小学数学几乎是一模一样的。/ 和 % 的区别:他们两个都是做除法运算,/取结果的商。% 取结果的余数。整数操作只能得到整数,如果想要得到小数,必须有浮点数参与运算。算术运算符的高级用法:是以+为例进行的讲解,其余减法,乘法,除法的运算规则也是一样的。特例:字符串只有+操作,没有其他操作。 && 和 & 、||和|的运行结果都是一模一样的。 但是短路逻辑运算符可以提高程序的运行效率。
2022-10-27 09:03:22 1142
typescript完整笔记
2023-06-15
Snipaste一款非常好用的截屏工具
2023-06-15
Appserv下载 appserv-x64-9.3.0
2023-06-15
前端笔记完整版(HTML、CSS、JS、JQuery、AJAX、VUE、React等笔记)
2023-06-13
运用jQuery和bootstrap编写的前端html响应式页面-时倾零食铺子
2022-11-16
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人