Coding-with-Front-end

Gorit 的前端学习记录

一、CSS 项目预览

1. 垂直居中
2. 等分布局
3. 等高布局
4. 多列布局
5. 居中布局
6. 全屏布局
7. 三列布局
8. 圣杯布局
9. 双飞翼布局
10. 水平居中布局
11. css 其他项目特别整理
12. position 布局整理

二、Flutter

Flutter 快速入门

三、GOG 设计模式

1. 发布订阅 —— 模式
2. 单例模式

四、interview 面试，笔试

概念题 面试题

• 001 防抖 与 节流函数实现
• 002 call，apply bind 实现
• 003 数组去重
• 004 手写 JS Array.flat 函数

五、JavaScript 项目预览

5.1 JavaScript 100 个案例

收集了 35+ 个 JavaScript 实践示例，涵盖核心概念和实现。

核心示例 (001-008)

• 防抖函数 / 节流函数实现
• call / apply / bind 自定义实现
• 展开运算符 / 回调函数
• 绘制三角形

事件处理 (009-017)

• 点击事件 / 鼠标经过/移出 / 聚焦失焦
• 文本框改变 / 页面加载/卸载

内置对象 (018-021)

• setTimeout / setInterval / clearTimeout
• Navigator 对象

Window 对象 (022-025)

• 打开新窗口 / 历史记录
• prompt / confirm 对话框

实战项目 (026-032)

• 换肤功能 / 计时器 / 计算器
• 轮播图 / 渐变色效果 / 当前时间

函数技巧 (033-035)

• 数组排序比较函数 / 阶乘递归 / arguments.callee

5.2 前端框架

1. Vue
2. React

5.3 ES6

参考书籍《深入理解ES6》

1. chapter1 —— var、let、const 以及作用域
2. chapter2 —— string and reg
3. chapter3 —— function、params
4. chapter4 —— object
5. chapter5 —— 解构赋值
6. chapter6 —— Sybol
7. chapter7 —— Set、Map
8. chapter8 —— Iterator —— generator iterator advanced iterator
9. chapter12 —— proxy and Reflect API

六、Project 部分

6.1 HTML + CSS + JS

50个原生编程案例应用

6.2 CSS projects in 15 days

一天一个案例学 CSS

6.3 javascript demo

• js 小案例

updated on 2020/2/1 by Gorit

七、TypeScript

1. 装饰器 demo
2. ts-study 学习

更新记录

2026/3/12 整合 JavaScript 目录，将 document、demo 合并到 100-js-demo，更新为 JavaScript 100 个案例

2026/3/12 update interview, add html+css+js demo

2023/11/01 update README, add interview support

2023/10/30 add ts-study demo

2023/7/15 rebuid for css demos's project structure, update vue2/vue3 projects

2023/6/24 add javascript demo for checkBox

2022/10/31 add flutter notes

2022/7/4 add proxy and reflect of es6 and put an end to summary

2022/6/12 add GOF

2022/6/8 add es6 of weak set examples

2022/5/31 add typescript branch, and edit decorator example

2022/5/31 add Symbol Examples

2022/5/25 add gif to display detail for projects of CSS in 15 days

2022/5/22 ES6 —— finish chaper8, next step may be Symbol or chapter9 (class in JavaScript)

2022/5/20 ES6 —— chapter8 iterator and generator, merge from es6

2022/5/17 ES6 —— chapter4 object, merge from es6

2022/4/11 ES6 —— chapter2 master merge from es6

2022/4/2 ES6 —— chapter2 更新 ing（节选）

2022/3/24 ES6 —— chapter1 内容更新完毕

2022/3/22 更新 ES6 内容，chapter1

2022/1/22 更新 HTML + CSS + JS 项目案例 —— 打字游戏

2022/1/6 拉出 Project 分支，重新梳理 HTML + CSS + JS 案例

2021/12/28 重新梳理项目结构，并划分分支

2020/6/25 更新了一个实战项目，Vue 开发电商后台管理系统

2020/2/11 更新了一个vue2.5 去哪网的项目