JavaScript 简介

历史回顾

JavaScript 诞生于1995年，由 Netscape 公司的 Brendan Eich 开发。它的发展历程如下：

1. 1995年：以 Mocha 的名称出现
2. 1995年底：改名为 LiveScript
3. 1996年初：最终命名为 JavaScript
4. 1996年11月：提交给 ECMA 进行标准化
5. 1997年：ECMA-262 标准第一版发布，ECMAScript 1.0 诞生

JavaScript 的组成

JavaScript 由三个部分组成：

1. ECMAScript：语言核心

   • 语法
   • 类型
   • 语句
   • 关键字
   • 保留字
   • 操作符
   • 全局对象

2. DOM（文档对象模型）

   • HTML 文档的编程接口
   • 将网页表示为节点树
   • 提供了访问和操作网页的方法

3. BOM（浏览器对象模型）

   • 提供与浏览器交互的方法和接口
   • 处理浏览器窗口和框架

JavaScript 的特点

1. 松散类型

let message = "Hello";    // 字符串
message = 123;            // 可以改变为数字
message = true;           // 可以改变为布尔值

2. 动态语言

// 对象可以动态添加属性
let person = {};
person.name = "John";     // 动态添加属性
person.sayHi = function() {  // 动态添加方法
    console.log("Hi!");
};

3. 函数是一等公民

// 函数可以作为值传递
function greet(fn) {
    fn();
}

greet(function() {
    console.log("Hello!");
});

4. 基于原型的面向对象

// 使用原型创建对象
function Person(name) {
    this.name = name;
}

Person.prototype.sayName = function() {
    console.log(this.name);
};

let person = new Person("John");
person.sayName(); // 输出: "John"

JavaScript 与 ECMAScript 的关系

• ECMAScript 是 JavaScript 的标准规范
• JavaScript 是 ECMAScript 的一个实现
• 现代浏览器实现了 ECMAScript 标准

ECMAScript 的版本

版本	发布年份	主要特性
ES6 (ES2015)	2015	类、模块、箭头函数、Promise
ES7 (ES2016)	2016	Array.prototype.includes
ES8 (ES2017)	2017	async/await、Object.values/entries
ES9 (ES2018)	2018	Rest/Spread、异步迭代
ES10 (ES2019)	2019	Array.prototype.flat、Object.fromEntries
ES11 (ES2020)	2020	可选链操作符、空值合并操作符

JavaScript 的应用场景

1. Web 开发

   • 前端交互
   • 表单验证
   • 动画效果
   • 异步通信

2. 服务器开发

   // Node.js 示例
   const http = require('http');
   
   http.createServer((req, res) => {
       res.writeHead(200, {'Content-Type': 'text/plain'});
       res.end('Hello World\n');
   }).listen(3000);

3. 移动应用开发

   • React Native
   • Ionic
   • NativeScript

4. 桌面应用开发

   • Electron
   • NW.js

开发工具与环境

1. 代码编辑器

• Visual Studio Code
• WebStorm
• Sublime Text

2. 浏览器开发者工具

• Chrome DevTools
• Firefox Developer Tools
• Safari Web Inspector

3. 在线编程环境

// 可以使用我们的在线编辑器
// [打开 JavaScript Playground](/playground/javascript)

最佳实践

1. 代码规范

// 使用严格模式
'use strict';

// 使用有意义的变量名
let firstName = "John";
let lastName = "Doe";

// 适当的代码缩进和注释
function calculateTotal(price, quantity) {
    // 计算总价
    return price * quantity;
}

2. 性能考虑

// 避免全局变量
const App = {
    init() {
        // 初始化代码
    },
    // 其他方法
};

// 使用事件委托
document.getElementById('list').addEventListener('click', (e) => {
    if (e.target.tagName === 'LI') {
        // 处理列表项点击
    }
});

练习题

1. 说明 JavaScript、ECMAScript 和 DOM、BOM 之间的关系。
2. 列举 JavaScript 的主要特点，并用代码示例说明。
3. 解释为什么 JavaScript 中函数被称为"一等公民"。

学习建议

• 理解 JavaScript 的发展历史有助于更好地理解语言特性
• 掌握 JavaScript 的基本组成部分
• 熟悉开发工具的使用
• 保持对新特性的关注

扩展阅读

• JavaScript 历史 - MDN
• ECMAScript 规范
• JavaScript 教程