文章分类 - 前端
发表于 2022-12-12 01:02阅读：69评论：0推荐：0
摘要：「学习笔记」JavaScript基础 前言 最近一直在跟着黑马教程学习JavaScript内容，遂把这一阶段的学习内容整理成笔记，巩固所学知识，同时也会参考一些博客，书籍上的内容，查漏补缺，给自己充充电🔋🔋 文章内容如有错误，欢迎指正批评✔️✔️ 工欲善其事，必先利其器，为了提高开发效率，选用V
阅读全文 »
「学习笔记」JavaScript基础 前言 最近一直在跟着黑马教程学习JavaScript内容，遂把这一阶段的学习内容整理成笔记，巩固所学知识，同时也会参考一些博客，书籍上的内容，查漏补缺，给自己充充电🔋🔋 文章内容如有错误，欢迎指正批评✔️✔️ 工欲善其事，必先利其器，为了提高开发效率，选用V
发表于 2022-12-12 01:00阅读：81评论：0推荐：0
摘要：「学习笔记」HTML基础 前言 勤做笔记不仅可以让自己学的扎实，更重要的是可以让自己少走弯路。有人说:"再次翻开笔记是什么感觉"，我的回答是:"初恋般的感觉"。或许笔记不一定十全十美，但肯定会让你有种初恋般的怦然心动。💖💖 本章着重复习Html的基础内容，学习Html究竟要学些什么呢？主要是学习
阅读全文 »
「学习笔记」HTML基础 前言 勤做笔记不仅可以让自己学的扎实，更重要的是可以让自己少走弯路。有人说:"再次翻开笔记是什么感觉"，我的回答是:"初恋般的感觉"。或许笔记不一定十全十美，但肯定会让你有种初恋般的怦然心动。💖💖 本章着重复习Html的基础内容，学习Html究竟要学些什么呢？主要是学习
发表于 2022-11-04 15:08阅读：1840评论：0推荐：1
摘要：1，常见的MIME类型(通用型)： 超文本标记语言文本 .html text/html xml文档 .xml text/xml XHTML文档 .xhtml application/xhtml+xml 普通文本 .txt text/plain RTF文本 .rtf application/rtf P
阅读全文 »
1，常见的MIME类型(通用型)： 超文本标记语言文本 .html text/html xml文档 .xml text/xml XHTML文档 .xhtml application/xhtml+xml 普通文本 .txt text/plain RTF文本 .rtf application/rtf P
发表于 2022-09-12 23:23阅读：0评论：0推荐：0
摘要：什么是Tomcat Tomcat简单的说就是一个运行JAVA的网络服务器，底层是Socket的一个程序，它也是JSP和Serlvet的一个容器。 为什么我们需要用到Tomcat 如果你学过html，css，你会知道你写的页面只能自己访问，别人不能远程访问你写的页面，Tomcat就是提供能够让别人访问
阅读全文 »
什么是Tomcat Tomcat简单的说就是一个运行JAVA的网络服务器，底层是Socket的一个程序，它也是JSP和Serlvet的一个容器。 为什么我们需要用到Tomcat 如果你学过html，css，你会知道你写的页面只能自己访问，别人不能远程访问你写的页面，Tomcat就是提供能够让别人访问
发表于 2022-09-12 21:29阅读：27评论：0推荐：0
摘要：为什么要学HTTP？ 我们绝大多数的Web应用都是基于HTTP来进行开发的。我们对Web的操作都是通过HTTP协议来进行传输数据的。 简单来说，HTTP协议就是客户端和服务器交互的一种通迅的格式。 HTTP的诞生主要是为了能够让文档之间相互关联，形成超文本可以互相传阅 可以说，Http就是Web通信
阅读全文 »
为什么要学HTTP？ 我们绝大多数的Web应用都是基于HTTP来进行开发的。我们对Web的操作都是通过HTTP协议来进行传输数据的。 简单来说，HTTP协议就是客户端和服务器交互的一种通迅的格式。 HTTP的诞生主要是为了能够让文档之间相互关联，形成超文本可以互相传阅 可以说，Http就是Web通信
发表于 2022-09-10 09:30阅读：0评论：0推荐：0
摘要：页面布局是样式开发的第一步，也是 CSS 最重要的功能之一。 常用的页面布局，其实就那么几个。下面我会介绍5个经典布局，只要掌握了它们，就能应对绝大多数常规页面。 这几个布局都是自适应的，自动适配桌面设备和移动设备。代码实现很简单，核心代码只有一行，有很大的学习价值，内容也很实用。 我会用到 CSS
阅读全文 »
页面布局是样式开发的第一步，也是 CSS 最重要的功能之一。 常用的页面布局，其实就那么几个。下面我会介绍5个经典布局，只要掌握了它们，就能应对绝大多数常规页面。 这几个布局都是自适应的，自动适配桌面设备和移动设备。代码实现很简单，核心代码只有一行，有很大的学习价值，内容也很实用。 我会用到 CSS
发表于 2022-09-10 00:47阅读：0评论：0推荐：0
摘要：这个系列教程的前两篇，介绍了小程序的项目结构和页面样式。 今天，接着往下讲，教大家为小程序加入 JavaScript 脚本，做出动态效果，以及如何跟用户互动。学会了脚本，就能做出复杂的页面了。 本篇的难度要大于前两篇，如果觉得不好理解，可以先跟着例子，动手做一遍，然后再读文字说明，可能就容易理解了。
阅读全文 »
这个系列教程的前两篇，介绍了小程序的项目结构和页面样式。 今天，接着往下讲，教大家为小程序加入 JavaScript 脚本，做出动态效果，以及如何跟用户互动。学会了脚本，就能做出复杂的页面了。 本篇的难度要大于前两篇，如果觉得不好理解，可以先跟着例子，动手做一遍，然后再读文字说明，可能就容易理解了。
发表于 2022-09-09 23:14阅读：0评论：0推荐：0
摘要：微信是中国使用量最大的手机 App 之一，日活跃用户超过3亿，月活跃用户超过11亿（2019年底统计），市场极大。 2017年，微信正式推出了小程序，允许外部开发者在微信内部运行自己的代码，开展业务。这引发了热烈反响，截止2020年6月，小程序数量已经超过了550万个。 小程序已经成为国内前端的一个
阅读全文 »
微信是中国使用量最大的手机 App 之一，日活跃用户超过3亿，月活跃用户超过11亿（2019年底统计），市场极大。 2017年，微信正式推出了小程序，允许外部开发者在微信内部运行自己的代码，开展业务。这引发了热烈反响，截止2020年6月，小程序数量已经超过了550万个。 小程序已经成为国内前端的一个
发表于 2022-08-10 14:00阅读：0评论：0推荐：0
摘要：前言 作为前端开发中现行最火的框架之一，Vue 在面试中出现的频率不断增加。基于此，总结了一些 Vue 方面经常出现的面试题，留给自己查看消化，也分享给有需要的小伙伴 感兴趣的小伙伴也可以点击 这里，查看前端方面的其他面试题，欢迎 star 关注 如果文章中有出现纰漏、错误之处，还请看到的小伙伴留言
阅读全文 »
前言 作为前端开发中现行最火的框架之一，Vue 在面试中出现的频率不断增加。基于此，总结了一些 Vue 方面经常出现的面试题，留给自己查看消化，也分享给有需要的小伙伴 感兴趣的小伙伴也可以点击 这里，查看前端方面的其他面试题，欢迎 star 关注 如果文章中有出现纰漏、错误之处，还请看到的小伙伴留言
发表于 2022-08-10 12:46阅读：130评论：0推荐：0
摘要：一、生命周期 先贴两张图： vue生命周期 小程序生命周期 相比之下，小程序的钩子函数要简单得多。 vue的钩子函数在跳转新页面时，钩子函数都会触发，但是小程序的钩子函数，页面不同的跳转方式，触发的钩子并不一样。 onLoad: 页面加载一个页面只会调用一次，可以在 onLoad 中获取打开当前页面
阅读全文 »
一、生命周期 先贴两张图： vue生命周期 小程序生命周期 相比之下，小程序的钩子函数要简单得多。 vue的钩子函数在跳转新页面时，钩子函数都会触发，但是小程序的钩子函数，页面不同的跳转方式，触发的钩子并不一样。 onLoad: 页面加载一个页面只会调用一次，可以在 onLoad 中获取打开当前页面
发表于 2022-08-10 12:42阅读：0评论：0推荐：0
摘要：在了解 Webpack 原理前，需要掌握以下几个核心概念，以方便后面的理解：
Entry：入口，Webpack 执行构建的第一步将从 Entry 开始，可抽象成输入。
Module：模块，在 Webpack 里一切皆模块，一个模块对应着一个文件。Webpack 会从配置的 Entry 开始递归找出所有依赖的模块。
Chunk：代码块，一个 Chunk 由多个模块组合而成，用于代码合并与分割。
Loader：模块转换器，用于把模块原内容按照需求转换成新内容。
Plugin：扩展插件，在 Webpack 构建流程中的特定时机会广播出对应的事件，插件可以监听这些事件的发生，在特定时机做对应的事情。
阅读全文 »
在了解 Webpack 原理前，需要掌握以下几个核心概念，以方便后面的理解：
Entry：入口，Webpack 执行构建的第一步将从 Entry 开始，可抽象成输入。
Module：模块，在 Webpack 里一切皆模块，一个模块对应着一个文件。Webpack 会从配置的 Entry 开始递归找出所有依赖的模块。
Chunk：代码块，一个 Chunk 由多个模块组合而成，用于代码合并与分割。
Loader：模块转换器，用于把模块原内容按照需求转换成新内容。
Plugin：扩展插件，在 Webpack 构建流程中的特定时机会广播出对应的事件，插件可以监听这些事件的发生，在特定时机做对应的事情。
发表于 2022-08-10 12:16阅读：0评论：0推荐：0
摘要：浏览器器内核拿到内容后，渲染大概可以划分成以下几个步骤：
解析html建立dom树
解析css构建render树（将CSS代码解析成树形的数据结构，然后结合DOM合并成render树）
布局render树（Layout/reflow），负责各元素尺寸、位置的计算
绘制render树（paint），绘制页面像素信息
浏览器会将各层的信息发送给GPU，GPU会将各层合成（composite），显示在屏幕上。
阅读全文 »
浏览器器内核拿到内容后，渲染大概可以划分成以下几个步骤：
解析html建立dom树
解析css构建render树（将CSS代码解析成树形的数据结构，然后结合DOM合并成render树）
布局render树（Layout/reflow），负责各元素尺寸、位置的计算
绘制render树（paint），绘制页面像素信息
浏览器会将各层的信息发送给GPU，GPU会将各层合成（composite），显示在屏幕上。
发表于 2022-08-10 12:08阅读：0评论：0推荐：0
摘要：同源策略是一个重要的安全策略，它用于限制一个origin的文档或者它加载的脚本如何能与另一个源的资源进行交互。它能帮助阻隔恶意文档，减少可能被攻击的媒介。
同源的定义
如果两个 URL 的 protocol、port (en-US) (如果有指定的话) 和 host 都相同的话，则这两个 URL 是同源。这个方案也被称为“协议/主机/端口元组”，或者直接是 “元组”。
同源策略控制不同源之间的交互，例如在使用XMLHttpRequest 或 标签时则会受到同源策略的约束。这些交互通常分为三类：
跨源写操作（Cross-origin writes）一般是被允许的。例如链接（links），重定向以及表单提交。特定少数的 HTTP 请求需要添加预检请求。
跨源资源嵌入（Cross-origin embedding）一般是被允许（后面会举例说明）。
跨源读操作（Cross-origin reads）一般是不被允许的，但常可以通过内嵌资源来巧妙的进行读取访问。
阅读全文 »
同源策略是一个重要的安全策略，它用于限制一个origin的文档或者它加载的脚本如何能与另一个源的资源进行交互。它能帮助阻隔恶意文档，减少可能被攻击的媒介。
同源的定义
如果两个 URL 的 protocol、port (en-US) (如果有指定的话) 和 host 都相同的话，则这两个 URL 是同源。这个方案也被称为“协议/主机/端口元组”，或者直接是 “元组”。
同源策略控制不同源之间的交互，例如在使用XMLHttpRequest 或 标签时则会受到同源策略的约束。这些交互通常分为三类：
跨源写操作（Cross-origin writes）一般是被允许的。例如链接（links），重定向以及表单提交。特定少数的 HTTP 请求需要添加预检请求。
跨源资源嵌入（Cross-origin embedding）一般是被允许（后面会举例说明）。
跨源读操作（Cross-origin reads）一般是不被允许的，但常可以通过内嵌资源来巧妙的进行读取访问。
发表于 2022-08-10 01:15阅读：0评论：0推荐：0
摘要：结论：
浏览器工作流程：构建DOM -> 构建CSSOM -> 构建渲染树 -> 布局 -> 绘制。
CSSOM会阻塞渲染，只有当CSSOM构建完毕后才会进入下一个阶段构建渲染树。
通常情况下DOM和CSSOM是并行构建的，但是当浏览器遇到一个不带defer或async属性的script标签时，DOM构建将暂停，如果此时又恰巧浏览器尚未完成CSSOM的下载和构建，由于JavaScript可以修改CSSOM，所以需要等CSSOM构建完毕后再执行JS，最后才重新DOM构建。
阅读全文 »
结论：
浏览器工作流程：构建DOM -> 构建CSSOM -> 构建渲染树 -> 布局 -> 绘制。
CSSOM会阻塞渲染，只有当CSSOM构建完毕后才会进入下一个阶段构建渲染树。
通常情况下DOM和CSSOM是并行构建的，但是当浏览器遇到一个不带defer或async属性的script标签时，DOM构建将暂停，如果此时又恰巧浏览器尚未完成CSSOM的下载和构建，由于JavaScript可以修改CSSOM，所以需要等CSSOM构建完毕后再执行JS，最后才重新DOM构建。
发表于 2022-08-10 00:48阅读：0评论：0推荐：0
摘要：面向对象编程很重要的一个方面，就是对象的继承。A 对象通过继承 B 对象，就能直接拥有 B 对象的所有属性和方法。这对于代码的复用是非常有用的。
大部分面向对象的编程语言，都是通过“类”（class）实现对象的继承。传统上，JavaScript 语言的继承不通过 class(ES6 引入了class 语法)，而是通过“原型对象”（prototype）实现。那么在JS中常见的继承方式有几种呢？
阅读全文 »
面向对象编程很重要的一个方面，就是对象的继承。A 对象通过继承 B 对象，就能直接拥有 B 对象的所有属性和方法。这对于代码的复用是非常有用的。
大部分面向对象的编程语言，都是通过“类”（class）实现对象的继承。传统上，JavaScript 语言的继承不通过 class(ES6 引入了class 语法)，而是通过“原型对象”（prototype）实现。那么在JS中常见的继承方式有几种呢？
发表于 2022-08-10 00:21阅读：0评论：0推荐：0
摘要：数字：^[0-9]*
数字：^[0-9]*
发表于 2022-08-10 00:13阅读：0评论：0推荐：0
摘要：一般来说没有被引用的对象就是垃圾，就是要被清除， 有个例外如果几个对象引用形成一个环，互相引用，但根访问不到它们，这几个对象也是垃圾，也要被清除。
阅读全文 »
一般来说没有被引用的对象就是垃圾，就是要被清除， 有个例外如果几个对象引用形成一个环，互相引用，但根访问不到它们，这几个对象也是垃圾，也要被清除。
发表于 2022-08-10 00:08阅读：33评论：0推荐：0
摘要：CSS能够生成各种形状。正方形和矩形很容易，因为它们是 web 的自然形状。添加宽度和高度，就得到了所需的精确大小的矩形。添加边框半径，你就可以把这个形状变成圆形，足够多的边框半径，你就可以把这些矩形变成圆形和椭圆形。
我们还可以使用 CSS 伪元素中的 ::before 和 ::after，这为我们提供了向原始元素添加另外两个形状的可能性。通过巧妙地使用定位、转换和许多其他技巧，我们可以只用一个 HTML 元素在 CSS 中创建许多形状。
虽然我们现在大都使用字体图标或者svg图片，似乎使用 CSS 来做图标意义不是很大，但怎么实现这些图标用到的一些技巧及思路是很值得我们的学习。
阅读全文 »
CSS能够生成各种形状。正方形和矩形很容易，因为它们是 web 的自然形状。添加宽度和高度，就得到了所需的精确大小的矩形。添加边框半径，你就可以把这个形状变成圆形，足够多的边框半径，你就可以把这些矩形变成圆形和椭圆形。
我们还可以使用 CSS 伪元素中的 ::before 和 ::after，这为我们提供了向原始元素添加另外两个形状的可能性。通过巧妙地使用定位、转换和许多其他技巧，我们可以只用一个 HTML 元素在 CSS 中创建许多形状。
虽然我们现在大都使用字体图标或者svg图片，似乎使用 CSS 来做图标意义不是很大，但怎么实现这些图标用到的一些技巧及思路是很值得我们的学习。
