JavaScript 实现 Tic Tac Toe (1)
> 第一部分主要讲解井字棋游戏初始化的一些东西，之后会讲一些技术性的东西。 下面我们通过实现一个简单的井字棋游戏来系统梳理一下前面的一些知识。 我们写一个最简单的 HTML 和 CSS： ```html <. doctype html> <html lang="en"> <head> <meta charset="utf-8" /> <meta name="viewport"...
2025
159 posts
发布——订阅模式
> 在实现 [TicTacToe](https://www. theodinproject...
js-module
在 ES6 模块出现之前，如果在 HTML 中引入多个 JavaScript 文件，它们会共享同一个全局作用域。这会导致变量命名冲突和不可预期的行为。 ```html <. html --> <script src="one...
JavaScript Class
在 ES6 之前，我们使用构造函数和原型链来实现对象的创建和继承。ES6 引入了 `class` 关键字，它提供了一种更清晰、更简洁的语法。 > Class 的底层实现仍然是基于原型继承。因此，`class` 被称为“语法糖”。 **构造函数 vs. Class 写法对比：** ```javascript // 传统构造函数写法 function Player(name, marker)...
闭包
JavaScript 有如下的作用域： - **全局作用域 (Global Scope)**: 在所有函数和代码块 `{}` 外面定义的变量，在代码的任何地方都可以被访问。 > 过度使用全局变量会造成“全局污染”。 - **函数作用域 (Function Scope)**: 使用 `var` 在一个函数内部声明的变量，它的“地盘”就是整个函数。 - **块级作用域 (Block...
container-design
Write your blog post content here. This is a new blog post...
Grid
CSS Grid 布局是一个强大的**二维 (2D)** 布局系统，意味着它可以同时处理**行和列**。与 Flexbox（一维）不同，Grid 允许我们在两个维度上对齐项目，是专门为解决复杂的网页布局问题而设计的。 Grid 由以下组件组成： - **Grid 容器 (Grid Container)**：应用了 `display: grid;` 的父元素。 - **Grid 项目...
JavaScript 原型链
我们可以在构造函数里为对象添加方法，但这存在一个严重的性能问题。 ```javascript function Player(name, marker) { this. name = name; this...
JavaScript 基础
```javascript // 创建数组 const fruits = ["Apple", "Banana", "Cherry"]; // 访问元素 console. log(fruits[0]); // "Apple" // 修改元素 fruits[1] = "Blueberry"; // 添加元素 fruits...
CSS 基础练习
> 这里是记录 Odin Project 中的一些 CSS 基础部分练习题的笔记，因为本人对 CSS 的理解并不是很好. > This one is a little nicer looking, and a little closer to something you might see in the real world...