Zlog
首页时间轴关于
Zlog

一个探索技术、编程和构建 Web 的个人空间。

© 2026 Zlog

导航

首页时间轴关于

链接

首页/分类/#frontend

#frontend

69 篇文章

automator-automatorautomator-testingbackendbackend-dbbackend-linuxbackend-nginxbackend-nodebackend-pythonbackend-servercomponents-componentscookiedatabasedeploymentdesignpatternfrontendfrontend-applicationfrontend-cssfrontend-frameworkfrontend-javascriptfrontend-protocolfrontend-reactfrontend-typescriptfrontend-vuefrontend-webpackgear-gitgear-terminalgear-toolsideminiprogram-miniprogramnextjsscrapysummary-scriptablesummary-summarytursovercelzlog
Facade
2 分钟
2021年12月26日·更新于

Facade

外观模式:就是提供一个统一的接口去访问多个子系统的多个不同的接口,为子系统中的一组接口提供统一的高层接口。使得子系统更容易使用,不仅简化类中的接口,而且实现调用者和接口的解耦。

frontenddesignpattern
Singleton
2 分钟
2021年12月26日

Singleton

单例模式:就是在整个运行时域,一个类只有一个实例对象。

frontenddesignpattern
Function Overloading
2 分钟
2021年12月19日

Function Overloading

函数名相同,函数的参数列表不同(参数个数、参数类型),根据参数的不同之行不同的操作。

frontendfrontend-javascript
Stylelint
2 分钟
2021年12月12日

Stylelint

JS 代码有 ESLint 等格式化工具来校验、格式化,相对的,CSS 也有格式化工具。本文就主流 CSS 格式化工具 Stylelint 以及我们为什么要做 CSS 样式格式化略作介绍。

frontendfrontend-css
JS惰性载入函数
1 分钟
2021年11月21日

JS惰性载入函数

惰性载入函数: 函数执行时会根据不同的判断分支最终选择合适的方案执行,但这样的分支判断仅会发生一次,后面的其他同类执行都不会再分支判断。提高了 JS 执行效率性能。

frontendfrontend-javascript
Yeilding Processes
1 分钟
2021年11月21日

Yeilding Processes

与桌面应用可以动态调整运行所需内存和处理器时间不同的是,运行在浏览器中的 JavaScript 都被分配了一个确定数量的资源,是有严格限制的。当 JavaScript 代码运行超过特定的时间或者语句数量就会被阻止继续执行,但实际开发中难免会遇到过长、过深嵌套的函数调用或者大数组的循环处理,为了解决这些问题就有了定时器及分块的解决方案。

frontendfrontend-javascript
WEB性能优化
1 分钟
2021年8月1日

WEB性能优化

内容分发网络 (Content Delivery Network)利用全局负载均衡和缓存系统

frontendfrontend-javascript
React生命周期
1 分钟
2021年7月25日

React生命周期

当组件实例被创建并插入 DOM 节点时,其生命周期调用顺序如下:

frontendfrontend-frameworkfrontend-react
类
1 分钟
2021年5月2日

类

类

frontendfrontend-typescript
声明文件
1 分钟
2021年5月2日

声明文件

实际开发中需要引入第三方库,但这些库不能使用 TS 的类型检查等特性方法,所以需要将这些库里的函数和方法体去掉后只保留导出类型声明,而产生了一个描述 JavaScript 库和模块信息的声明文件。通过引用这个声明文件,就可以借用 TypeScript 的各种特性来使用库文件了。

frontendfrontend-typescript
enum枚举类型的注意点
1 分钟
2021年5月2日

enum枚举类型的注意点

enum枚举类型的注意点

frontendfrontend-typescript
泛型
1 分钟
2021年5月2日

泛型

定义一个创建数组的方法, 可以创建出指定长度的数组, 并且可以用任意指定的内容填充这个数组。

frontendfrontend-typescript
接口
2 分钟
2021年5月2日

接口

接口是一系列抽象方法的声明,是一些方法特征的集合,这些方法都应该是抽象的,需要由具体的类去实现,然后第三方就可以通过这组抽象方法调用,让具体的类执行具体的方法。

frontendfrontend-typescript
类型断言
1 分钟
2021年5月2日

类型断言

类型断言可以手动指定一个变量的类型,即允许一个变量从一个类型转换到另一个类型。

frontendfrontend-typescript
数组|元组类型变量声明
1 分钟
2021年5月2日

数组|元组类型变量声明

TS中的元祖类型其实就是数组类型的扩展,元祖用于保存定长定数据类型的数据

frontendfrontend-typescript
正则表达式
2 分钟
2021年4月18日

正则表达式

正则表达式常用的基本操作

frontendfrontend-javascript
Vue刷新页面的三种方式
1 分钟
2021年2月1日

Vue刷新页面的三种方式

location.reload();

frontendfrontend-frameworkfrontend-vue
继承
3 分钟
2020年12月14日

继承

继承:就是利用原型让一个引用类型继承另一个引用类型的属性和方法。

frontendfrontend-javascript
创建对象
3 分钟
2020年11月27日

创建对象

构造函数模式 + 原型模式 组成的组合模式是创建自定义类型的最常见方法。

frontendfrontend-javascript
Vue响应式原理及2.x和3.x的区别
1 分钟
2020年11月1日

Vue响应式原理及2.x和3.x的区别

Vue响应式原理及2.x和3.x的区别

frontendfrontend-frameworkfrontend-vue
ES6
7 分钟
2020年10月26日

ES6

Set 对象允许存储任何类型对唯一值(不重复)

frontendfrontend-javascript
数组扁平化
1 分钟
2020年10月23日

数组扁平化

将多维数组转换成一个一维数组 [1, [2, 3, [4, 5]]] ------> [1, 2, 3, 4, 5]

frontendfrontend-javascript
防抖和节流
2 分钟
2020年7月14日

防抖和节流

如下 input 输入 keyup 监听

frontendfrontend-javascript
Vue生命周期
1 分钟
2020年7月5日

Vue生命周期

Vue 生命周期即 Vue 实例从创建->运行->销毁过程中暴露出来的一系列函数,也称 Vue 钩子(函数)

frontendfrontend-frameworkfrontend-vue
登陆请求拦截
2 分钟
2020年3月2日

登陆请求拦截

在定义路由的时候多添加一个字段 requireAuth, 用于判断该路由的访问是否需要登录,若用户已登录,则顺利进入路由,否则跳转至登录页面

frontendfrontend-javascript
Proxy实现表单拦截校验
1 分钟
2020年3月2日

Proxy实现表单拦截校验

Proxy实现表单拦截校验

frontendfrontend-javascript
浏览器缓存
2 分钟
2020年3月2日

浏览器缓存

HTTP Cookie(也叫 Web Cookie 或者浏览器 Cookie)是服务器发送到用户浏览器并保存在本地的一小块数据,他会在浏览器下次向同一服务器再发起请求时被携发送到服务器上。通常,它用于告知服务器两个请求是否来自同浏览器,如保护用户的登录状态。Cookie 使基于无状态的HTTP协议记录稳定的状态信息成为可能。

frontendcookie
Jsonp封装
1 分钟
2020年3月1日

Jsonp封装

Jsonp封装

frontendfrontend-javascript
组件发布到 NPM
3 分钟
2020年2月28日

组件发布到 NPM

基于 vue-cli 3.0 开发,已发布到 npm 上的 UI 组件 —— :link: ti-ui-self

frontendfrontend-vuecomponents-components
Grid
4 分钟
2020年2月21日

Grid

Grid 布局是将容器划分成"行"和"列",产生单元格,然后指定"项目所在"的单元格,可以看作是二维布局,比Flex布局更加强大。采用网格布局的区域,称为"容器"(container),容器内部采用网格定位的子元素,称为"项目"(item)。

frontendfrontend-css
pseudo classes(伪类)
1 分钟
2020年1月19日

pseudo classes(伪类)

a:x 有序生效 link -> visited -> hover -> active

frontendfrontend-css
Js浅拷贝和深拷贝
3 分钟
2020年1月1日

Js浅拷贝和深拷贝

Js浅拷贝和深拷贝

frontendfrontend-javascript
new
1 分钟
2020年1月1日

new

创建类的新实例,必须调用 new 操作符,以这种方式调用构造函数实际经历了四步:

frontendfrontend-javascript
BFC
1 分钟
2019年12月28日

BFC

BFC 是块级格式化上下文 (Block Formatting Context) 的缩写。

frontendfrontend-css
CSS书写规范
1 分钟
2019年12月28日

CSS书写规范

CSS书写规范

frontendfrontend-css
position
1 分钟
2019年12月28日

position

.top 元素距离其在正常文档流中的位置 top: 10px

frontendfrontend-css
Unit
1 分钟
2019年12月28日

Unit

| 单位 |描述 |

frontendfrontend-css
Vue-cli
1 分钟
2019年12月28日

Vue-cli

1. 新建目录:mkdir vue-cli2

frontendfrontend-frameworkfrontend-vue
数组的访问方法
4 分钟
2019年12月28日

数组的访问方法

arr.concat(value1[, value2[, ...[, valueN]]])

frontendfrontend-javascript
数组的迭代方法
13 分钟
2019年12月28日

数组的迭代方法

arr.entries()

frontendfrontend-javascript
数组的修改方法
5 分钟
2019年12月28日

数组的修改方法

arr.copyWithin(target[, start[, end]])

frontendfrontend-javascript
数组
3 分钟
2019年12月28日

数组

在 MDN 的基础上附加一些想法及常用示例。

frontendfrontend-javascript
箭头函数
1 分钟
2019年12月28日

箭头函数

箭头函数表达式的语法比函数表达式更简洁,并且没有自己的 this、arguments、super 和 new.target。箭头函数更适用于本来应该需要匿名函数的地方,并且它们不能用作构造函数。

frontendfrontend-javascript
无法访问 undefined、null 的属性
1 分钟
2019年12月28日

无法访问 undefined、null 的属性

而访问另外三个原始类型(Number、String、Number)则不会存在问题。

frontendfrontend-javascript
Error 类型
1 分钟
2019年12月28日

Error 类型

代表了一个关于 eval 函数的错误,但不在当前 ECMAScript 规范中使用,因此不会被 JavaScript 抛出,但是 EvalError 对象仍然保持兼容。

frontendfrontend-javascript
对象的构造函数方法
3 分钟
2019年12月28日

对象的构造函数方法

func.apply(thisArg, [argsArray])

frontendfrontend-javascript
隐式转换
2 分钟
2019年12月28日

隐式转换

::: tip 默认的 falsy

frontendfrontend-javascript
调用表达式
1 分钟
2019年12月28日

调用表达式

当对调用表达式进行求值的时候,首先计算函数表达式,然后计算参数表达式,得到一组参数值。如果函数表达式的值不是一个可调用对象,则抛出一个类型错误异常(所有的函数都是可调用的,即使宿主对象不是函数它也有可能被调用)。然后,实参的值将依次赋值给形参,这些形参是定义函数时指定的,接下来开始执行函数体。如果函数使用 return 语句给出一个返回值,那么这个返回值就是整个调用表达式的值。否则,调用表达...

frontendfrontend-javascript
函数调用
2 分钟
2019年12月28日

函数调用

函数定义从 function 关键字开始,构成函数主体的 JavaScript 代码在定义之时并不会执行,只有调用该函数时,它们才会执行。

frontendfrontend-javascript
对象构造函数冻结方法
2 分钟
2019年12月28日

对象构造函数冻结方法

Object.freeze(obj)

frontendfrontend-javascript
对象构造函数属性方法
4 分钟
2019年12月28日

对象构造函数属性方法

Object.defineProperty(obj, prop, descriptor)

frontendfrontend-javascript
对象的构造函数方法
7 分钟
2019年12月28日

对象的构造函数方法

在 ES5 时存在三种:

frontendfrontend-javascript
对象的实例函数方法
3 分钟
2019年12月28日

对象的实例函数方法

obj.hasOwnProperty(prop)

frontendfrontend-javascript
处理 JSX 中函数调用
1 分钟
2019年12月28日

处理 JSX 中函数调用

虽然期望的是传递函数引用,然而实际上是函数调用,为了解决这个问题通常存在一些解决方案。

frontendfrontend-javascript
作用域与闭包
3 分钟
2019年12月28日

作用域与闭包

尽管 JavaScript 被划分到 “动态” 或 “解释型” 语言的范畴,但是其实他是一个编译型语言。它不像许多传统意义上的编译型语言那样预先被编译好,编译的结果也不能在各种不同的分布式系统间移植。

frontendfrontend-javascript
语句和表达式
2 分钟
2019年12月28日

语句和表达式

一种常见的现象是,开发者们假定“语句(statement)”和“表达式(expression)”是大致等价的,而实际上在 JavaScript 中它们存在一些非常重要的区别。

frontendfrontend-javascript
字符串拼接方法
1 分钟
2019年12月28日

字符串拼接方法

str.concat(string2, string3[, ..., stringN])

frontendfrontend-javascript
字符串格式化方法
2 分钟
2019年12月28日

字符串格式化方法

str.toLowerCase()

frontendfrontend-javascript
字符串查询方法
3 分钟
2019年12月28日

字符串查询方法

str.charAt(index)

frontendfrontend-javascript
字符串正则方法
2 分钟
2019年12月28日

字符串正则方法

str.match(regexp)

frontendfrontend-javascript
字符串截取方法
3 分钟
2019年12月28日

字符串截取方法

str.replace(regexp|substr, newSubStr|function)

frontendfrontend-javascript
this 关键字
2 分钟
2019年12月28日

this 关键字

虽然 this 可能经常看起来是与 “面向对象模式” 有关的,但在 JavaScript 中 this 是一个不同的概念。

frontendfrontend-javascript
常用数组方法及分类
2 分钟
2019年10月19日

常用数组方法及分类

| 方法 | 作用 ...

frontendfrontend-javascript
隐式类型转换的妙用
1 分钟
2019年10月19日

隐式类型转换的妙用

隐式类型转换的妙用

frontendfrontend-javascript
跨域及几种解决方法
4 分钟
2019年10月14日

跨域及几种解决方法

跨域:指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的,是浏览器对 javascript 施加的安全限制。

frontendfrontend-javascript
Webpack原理浅析
2 分钟
2019年8月18日

Webpack原理浅析

webpack 是一个模块打包机制,将根据文件间的依赖关系对其进行静态分析,然后将这些模块按指定规则生成静态资源。

frontendgear-toolsfrontend-webpack
Webpack4.0
6 分钟
2019年8月18日

Webpack4.0

npm install webpack webpack-cli -g

frontendgear-toolsfrontend-webpack
Js垃圾收集机制原理
1 分钟
2019年8月17日

Js垃圾收集机制原理

  垃圾收集器按照预定的时间间隔,重复执行回收未使用变量所占用的内存。

frontendfrontend-javascript
Js之 toString() 和 String() 的区别
1 分钟
2019年7月5日

Js之 toString() 和 String() 的区别

Js之 toString() 和 String() 的区别

frontendfrontend-javascript