9JavaScript: The Good Parts

风格

编码风格

缩进命名规范大括号代码整洁

🎯 AI 时代的学习建议:不要只读理论。理解这一章的设计动机(为什么需要这个概念?)和边界条件(什么情况下会失效?)。当 AI 生成的代码涉及这些概念时,你能判断它是否用对了场景。AI 能帮你总结内容,但无法替代你亲手阅读、思考、建立直觉的过程。

第9章:风格(Style)

一、导读

1.1 本章学习目标

第9章讲解 JavaScript 的编码风格。好的风格让代码更易读、更易维护。

1.2 为什么第九章如此重要

代码是写给人看的,顺便让机器执行。好的风格是专业程序员的标志。

1.3 核心问题引导

缩进应该用空格还是 Tab?

命名规范是什么?

大括号应该放在哪里?

如何保持代码整洁?


二、核心概念详解

9.1 缩进

javascript
// Crockford 推荐:4 个空格
function hello() {
    if (true) {
        console.log("Hello");
    }
}

// 不要使用 Tab
// Tab 在不同编辑器中显示不同

9.2 命名规范

javascript
// 变量和函数:camelCase
var myVariable = 42;
function myFunction() { }

// 构造函数:PascalCase
function MyClass() { }
var instance = new MyClass();

// 常量:UPPER_SNAKE_CASE
var MAX_COUNT = 100;

// 私有变量:以下划线开头
var _privateVar = "secret";

9.3 大括号

javascript
// 左大括号放在同一行(K&R 风格)
if (condition) {
    // ...
} else {
    // ...
}

// 避免:左大括号单独一行
// JavaScript 的分号自动插入会导致问题
// return
// {  // 这里会被插入分号
//     value: 42
// };

9.4 代码整洁

javascript
// 好的风格
var name = "Alice";
var age = 30;
var greeting = "Hello, " + name + "! You are " + age + " years old.";

// 差的风格
var n="Alice";var a=30;var g="Hello, "+n+"! You are "+a+" years old.";

三、实战案例

9.1 JSLint/JSHint

javascript
// 使用 JSLint 检查代码风格
/*jslint browser: true, devel: true */
/*global jQuery */

(function () {
    "use strict";
    
    function init() {
        var element = document.getElementById("app");
        element.innerHTML = "Hello, World!";
    }
    
    init();
}());

四、本章小结

好的代码风格让代码更易读。使用 4 空格缩进、camelCase 命名、K&R 大括号风格。使用 JSLint 检查代码。


五、思考与练习

缩进应该用空格还是 Tab?

命名规范是什么?

大括号风格为什么重要?

如何保持代码整洁?

代码风格检查工具有哪些?


9/9风格
0%