JS学习篇（一） JavaScript语言特性

 

最近在学习Web开发，除了之前学习笔记提到的HTML和CSS，Web开发三件套的第三样就是JavaScript（即JS）。说到JavaScript，大家就算没接触过应该也会熟悉，只要稍微看过Web开发相关学习网站的目录或者课程表就知道这是一门必修的语言课了。

好，那么JavaScript是一门什么样的必修课，它是什么呢？为啥Web开发者是必修的！在写这篇学习笔记之前，我稍微查了一下，也把这么多年以来自己粗略使用过程中的模糊感扫清，算是对这门看似简单但不易精通的语言进行一个总结。

---

JavaScript（简称JS）是一门函数为先的轻量级解释型或者即时编译型的编程语言。

简短的厉害，非常好！首先JS是一门编程语言，这是它跟HTML和CSS的本质区别，HTML是一种标记语言，而CSS则是一组样式规则，用来描述HTML元素样式。那么什么是函数为先？如果有学过其他编程语言（例如C、C++、C#、Java、Python等）的童鞋应该也清楚，函数就是一组独立的程序代码段，按照一定的参数输入，运行函数体代码后输出结果。在JS中可以把函数当作一般变量那样使用，它同样也可以作为另一个函数的参数传入，也可以作为函数的结果输出，这种语言设计为函数使用提供了很大便利，而它不像其他语言中使用函数的那么麻烦，需要利用指针、委托等技术来实现上面的效果。在JS中可以像普通变量那样使用函数，如下所示：

把函数赋值给一个变量foo：

//声明了一个const变量foo
const foo = function() {
   console.log("foobar");
}
//用变量来调用它
foo();

 把函数sayHello当作参数传给另一个函数greeting：

function sayHello() {
   return "Hello, ";
}
function greeting(helloMessage, name) {
  console.log(helloMessage() + name);
}
//传递 `sayHello` 作为 `greeting` 函数的参数
greeting(sayHello, "JavaScript!"); // Hello, JavaScript!

通过函数sayHello返回了另一个函数并赋值给myFunc：

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

const myFunc = sayHello();
myFunc(); // Hello!

是不是很方便？

OK，接下来看什么是“轻量级解释型”和“即时编译型”，说到这个也是必须要提到上面的C、C++、C#、Java这几种相对“低层”的编程语言，这些语言的普遍特点是需要经过一个叫做“编译”的过程将编程代码翻译成电脑机器可以允许的程序代码，再执行。那么它们的运行过程将是这样的：

 而JS的运行是像下面这样的：

相比起来，JS的代码不需要进行编译这个步骤，而是“直接解释并运行”的，是不是十分直接？没错，这就是它叫解释型、即时编译型的原因。

那么，为什么JS这么好可以直接解释并运行，而C、C++之类的语言还要分两步走，要不都设计成解释型不就好了？其实这就涉及一个很简单的问题——性能，即程序执行效率。这个很好理解，C、C++这类编程语言先把程序翻译成机器容易理解的“程序代码”，然后在需要它的时候，直接“运行”是比JS这类语言“解释并运行”要快的多，因为它们花费了一定时间在程序的编译阶段，所以换来了执行时的高效，而JS代码是逐行解释并运行，所以显得更加方便，但相对低效。简单来说，就是不同语言的适用场景不同，C、C++这类语言适合做一些对性能要求较高的项目，例如游戏，图像处理等，而JS、Python这样的高层语言适合做一些逻辑业务有关的项目，所以JS和Python这类语言也叫脚本语言。

除了上面说到的那一句“JavaScript是一门函数为先的轻量级解释型或者即时编译型的编程语言”，也有像“JavaScript 是一种基于原型编程、多范式的动态脚本语言，并且支持面向对象、命令式和声明式（如函数式编程）风格”的说法，其实我觉得这些说法只是从不同维度、层次来解释，但它们并不冲突，希望通过日后的学习可以更加深入的了解并解释。

---

上面为了解释什么是JS就用了挺长的篇幅，不过问题不大，只要能解释清楚并且加深自己对这门语言的了解，目的就算达到了。虽然有点乱，但接下来要讲一下JS的由来：

在1995年时，由Netscape（网景）公司的Brendan Eich，在Netscape浏览器上首次设计实现而成。因为Netscape与Sun公司合作，Netscape管理层希望它外观看起来像Java，因此取名为JavaScript。

原来如此，所以JavaScript跟Java其实没太大关系，所以不要混淆它们，它们只是由于公司（Sun）相关所以名字相似，实际上无论语法还是应用领域上都是完全不同的两个玩意。

后来呢？我还听说过一个叫ES的玩意，它跟JS是什么关系？ECMAScript（即ES）是一个由ECMA国际组织编写的编程语言标准，它是JS的语言基础，所以JS其实是一个基于ES标准的具体实现版本，同样基于ECMAScript的语言还有JScript（微软）和ActionScript（Adobe），更多关于ES的说明可以参考MDN的JS资源。

那么其实JS就是ECMAScript的一个语言实现版本咯？不全是。我们回到Web开发的讨论上，我们把JS与HTML、CSS归为Web开发套件的三要素之一，那么在Web这个领域上JS至少还要包含DOM和BOM这两项技术，其实就是用来操作网页和浏览器的编程接口（API），有了语言核心（ECMAScript）后，又基于语言核心在浏览器中实现了DOM和BOM两套API，这样的话，JS才开始具备在Web开发中的地位。——正如网上很流行的一类说法“HTML之于网页是结构，CSS是表现，JS是动态行为”。

 

总结

最后，这篇笔记虽然没有具体记录的语言语法使用上知识点，但是希望以此为出发点能够更深刻理解JS并进一步学习。如上面描述有哪些地方写得不对或者不好，望各位童鞋指出并共同讨论。