JavaScript学习笔记：1.JavaScript简介

原创于 2025-12-11 16:54:58 发布 · 491 阅读

5 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #学习 #笔记

JavaScript学习笔记专栏收录该内容

2 篇文章

订阅专栏

JavaScript学习笔记：1.JavaScript简介

打开网页时，弹出的欢迎弹窗、滑动时的平滑动画、点击就刷新的投票按钮——这些让静态页面变得生动有趣的互动，背后都藏着同一个“幕后功臣”：JavaScript（简称JS）。这门诞生于网页的脚本语言，如今早已跳出浏览器的“舒适区”，在服务器、手机App、智能设备等多个领域发光发热。今天就来聊聊，这门既灵活又强大的语言，到底是什么来头？

一、什么是JavaScript？——不止于“网页互动”

简单说，JavaScript是一门跨平台、面向对象的脚本语言。先拆解这两个关键属性，你就懂了：

「跨平台」：不管你用Chrome、Firefox还是Edge浏览器，甚至用Node.js跑在服务器上，JS代码都能正常工作——就像一部好电影，在电影院、电脑、手机上看都不影响体验。
「面向对象+脚本语言」：不用像Java、C++那样写复杂的类声明、编译步骤，直接写代码就能运行；同时它又能创建对象、实现继承，兼顾了灵活性和功能性。

JS的核心使命是“让网页可交互”，但它的能力远不止于此：

客户端（浏览器里）：操控网页的“骨架”（DOM）——比如修改文章标题、隐藏广告弹窗、验证表单输入（比如提醒你“手机号格式不对”），甚至做复杂的Canvas动画、游戏。
服务器端（Node.js）：对接数据库、处理文件、实现实时通信（比如微信网页版的消息同步）——相当于给网站装上“大脑”，不再只是单纯展示内容。

它的组成也很清晰：就像一套“工具箱”，包含「核心语言元素」（运算符、if-else、循环这些基础操作）和「标准库」（比如处理日期的Date、做数学计算的Math、操作数组的Array），再加上不同环境的“扩展工具”（浏览器的DOM操作、Node.js的数据库工具），就能应对各种场景。

二、和Java的“误会”：名字像，实则毫无血缘

很多初学者都会被名字误导，以为JavaScript是Java的“小弟”——其实二者的关系，就像“熊猫”和“熊猫烧香”：除了名字沾边，本质上毫无关联。

用一张“灵魂对比表”，看懂它们的核心区别：

维度	JavaScript	Java
继承方式	原型继承：对象直接继承原型，想加属性就加（比如给一个对象临时加个`age: 18`）	类继承：必须先定义类，实例不能随便加属性
变量类型	动态类型：不用声明“这是数字/字符串”，`let a = 10`和`a = "hello"`随便换	静态类型：必须声明类型，`int a = 10`就不能改成字符串
运行方式	脚本语言：直接解释运行，不用编译	编译型语言：先编译成字节码，再运行
核心定位	灵活多变，主打“快速实现互动”	严谨稳定，主打“大型应用开发”

一句话总结：Java是“穿西装的严谨工程师”，讲究规则和类型安全；JavaScript是“穿卫衣的创意达人”，追求灵活和快速落地。当年JS改名，只是为了蹭Java的热度，没想到这个“误会”持续了几十年～

三、背后的“规矩”：ECMAScript到底是什么？

你可能听过“ES6”“ES2020”这些名词，它们和JavaScript是什么关系？答案是：ECMAScript是JavaScript的“语法说明书”。

因为不同浏览器（Chrome、Firefox）都要实现JavaScript，如果没有统一标准，可能会出现“同一段代码在Chrome能跑，在Firefox就报错”的情况。这时ECMA国际（一个标准化组织）站了出来，制定了ECMAScript规范（文档编号ECMA-262），规定了JS该有哪些功能、语法规则是什么。

简单说：

ECMAScript = 语言的“官方规则”（比如必须支持let变量、箭头函数()=>{}）；
JavaScript = 浏览器/Node.js根据规则实现的“产品”（包含规则里的所有功能，还加了DOM操作、数据库交互等扩展）。

所以我们写代码时，不用纠结“这个功能浏览器支不支持”——只要是ECMAScript标准里有的，现代浏览器基本都实现了。

四、5分钟入门：不用装软件，浏览器就能玩

学习JS不用复杂的配置，你的浏览器就是“最佳IDE”。跟着做，5分钟就能写出第一个JS程序：

打开任意现代浏览器（Chrome、Edge、Firefox都可以）；
按F12（或右键“检查”），调出“开发者工具”，切换到“控制台（Console）”标签；
在输入框里直接写代码，按回车就能运行：
- 试试简单计算：输入2 + 2，回车出4（像计算器一样）；
- 试试修改网页：输入document.title = "我把网页标题改了！"，回车后看浏览器标签栏，标题真的变了；
- 试试互动弹窗：复制这段代码，粘贴进去回车：
```
(function () {
  "use strict";
  function greetMe(yourName) {
    alert(`你好，${yourName}！`);
  }
  greetMe("JS新手");
})();
```
这时浏览器会弹出“你好，JS新手！”的弹窗——恭喜你，写出了第一个有互动的JS代码！