JavaScript简介 | lh11223326

Web应用的开发，如我们日常使用的网页基本都是由HTML，CSS，JavaScript构成的，通过JavaScript我们可以实时更新网页中元素的样式，并可以实现人跟网页之间的交互(如监听用户是否点击了鼠标或按下了某个按键等等)。初识CSS-CSDN博客 0基础看这一篇就够了HTML教程(详细汇总)_php代码格式-CSDN博客

JavaScript 指南 - JavaScript | MDN (mozilla.org) 此网站有着完整的js基础资源：

JavaScript简介-LMLPHP

移动应用开发：我们可以进行Web应用开发，JavaScript还可以用来开发手机或者电脑上的应用程序，我们还可以借助一些优秀的框架(如react native),让开发过程变得更加轻松。

Web游戏：在网页上面玩的游戏都可以使用JavaScript来实现。

后端Web开发：我们可以使用JavaScript来进行web应用程序的前端部分的开发，但是随着Node.JS(一个JavaScript运行环境)让JavaScript可以用来开发Web应用程序的后端。

了解JavaScript：

前言：

我们知道一个网页基本是由JavaScript，HTML和CSS构成的，其中：

HTML用来定义网页的内容，如图片，文本。
CSS用来控制网页的外观，如颜色，字体，背景等等
JavaScript用来实时更新网页中的内容，如从服务获取数据并更新到网页中，修改某些标签的演示或中的内容等，可以让网页更加生动。

JavaScript的历史：

JavaScript最初被称为LiveScript，由Netscape(Netscape Communications Corporation,网景通信公司)公司的布兰登-艾奇(Brenda Eich)在1995年开发。在Nescape与Sun(一家互联万公司，全称为"Sun Microsystems",现已被甲骨文公司收购)合作之后将其更名为了JavaScript。

之所以将LiveScript更名为JavaScript，是因为JavaScript是受Java的启发而设计的，因此在语法上他们有很多相似之处，JavaScript中的许多命名规范也都借鉴自Java，还有一个原因就是为了营销，蹭Java的热度。

同时期，微软和Nombas(一家名为Nombas的公司)也分别开发了JScript和ScriptEase两种脚本语言，与JavaScript形成了三足鼎立之势，他们之间没有统一的标准，不能互用，为了解决这一问题，1997年，在ECMA(欧洲计算机制造商协会)的协调下，Netscape，Sun，微软，Borland(一家软件公司)组成了工作组，并以JavaScript为基础制定了ECMA-262标准(ECMAScript).

第二年，ISO/IEC(国际标准化组织及国际电工委员会)也采用了ECMAScript作为标准(即ISO/IEC-16262)。

JavaScript简介-LMLPHP

JavaScript与ECMAScript：

ECMAScript(简称"ES")是根据ECMA-262标准实现的通用脚本语言，ECMA-262标准主要规定了这门语言的语法,类型，语句，关键字，保留字，操作符，对象等几个部分，目前ECMAScript的最新版是ECMAScript6(简称"ES6"),

至于JavaScript，有人会将JavaScript与ECMAScript看作是相同的，其实不然，JavaScript中包含的内容远比ECMA-262中规定的多得多，完整的JavaScript是由以下三个部分组成：

核心(ECMAScript):提供语言的语法和基本对象；
文档对象模型(DOM):提供处理网页内容的方法和接口；
浏览器对象模型(BOM):提供与浏览器进行交互的方法和接口；

如何运行JavaScript以及JavaScrip的特点：

如何运行JavaScript：

作为一种脚本语言，JavaScript代码不能独立运行，通常情况下我们需要借助浏览器来运行JavaScript代码，所有Web浏览器都支持JavaScript.

除了可以再浏览器中执行外，也可以在服务器端或者搭载了JavaScript引擎的设备中执行JavaScript代码，浏览器之所以能够运行JavaScript代码就是因为浏览器中都嵌入了JavaScript引擎，常见的JavaScript引擎有：

V8：Chrom和Opera中的JavaScript引擎。
SpiderMonkey：firefox中的JavaScript引擎。
Chakra：IE中的JavaScript引擎。
ChakraCore：Microsoft Edge中的JavaScript引擎。
SquirreIFish：Safari中的JavaScript引擎。

JavaScript的特点：

解释型脚本语言：JavaScript是一种解释型脚本语言，与C,C++等语言需要先编译再运行不同，使用JavaScript编写的代码不需要编译，可以直接运行。
面向对象：JavaScript是一种面向对象语言，使用JavaScript不仅可以创建对象，也能操作使用已有的对象。
弱类型：JavaScript是一种弱类型的变成语言，对使用的数据类型没有严格的要求，如你可以将一个变量初始化为任意类型，也可以随时改变这个变量的类型。
动态性：JavaScript是一种采用事件驱动的脚本语言，它不需要借助Web服务器就可以对用户输入做出响应，如我们在访问一个网页时，通过鼠标在网页中进行点击或者滚动窗口时，通过JavaScript可以直接对这些事件做出响应。
跨平台：JavaScript不依赖操作系统，在浏览器中就可以运行，因此一个JavaScript脚本在编写完之后可以再任意系统上运行，只要系统上的浏览器支持JavaScript即可。

编写JavaScript代码并运行：

在HTML文档中编写JavaScript代码：

在HTML页面中嵌入JavaScript脚本需要使用<script>标签,用户可以在<script>标签中直接编写JavaScript代码。

现代浏览器默认<script>标签的脚本类型为JavaScript，因此可以省略type属性，如果是浏览器版本太早了就需要设置type属性。

如下：document.write("<h1>bilibili：https://www.bilibili.com/</h1>");

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        document.write("<h1>bilibili：https://www.bilibili.com/</h1>");
    </script>
</head>

<body>

</body>
</html>

在JavaScript脚本中，document表示网页文档对象，document.write()表示调用Document对象的write()方法，在当前网页源代码中写入HTML字符串"<h1>bilibili：https://www.bilibili.com/</h1>".运行结果如下：

JavaScript简介-LMLPHP

在脚本中编写JavaScript代码：

JavaScript程序不仅可以直接放在HTML文档中，也可以放在JavaScript脚本中，JavaScript脚本文件是文本文件，扩展名为.js,使用任何文件编辑器都可以编辑。

常用的文本编辑器有windows系统中的记事本，Linux系统中的Vim，Sublime Text，Notepad++等，对于初学者来说建议先使用文本编辑器来编写JavaScript代码，这样有助于我们队JavaScript语法，关键字，函数等内容的记忆。等到了实际开发阶段，则可以选择一些更加专业的代码编辑器，如Visual Studio Code(简称"VS Code")，WebStorm(收费)，Atom等，这样可以提高开发效率。

新建 JavaScript 文件的步骤如下。
第1步，新建文本文件，保存为 test.js。注意，扩展名为.js，它表示该文本文件是 JavaScript 类型的文件。
第2步，打开 test.js 文件，在其中编写如下 JavaScript 代码。

alert("C语言中文网：c.biancheng.net");

在上面代码中，alert() 表示 Window 对象的方法，调用该方法将弹出一个提示对话框，显示参数字符串 "Hi, JavaScript!"。
第3步，保存 JavaScript 文件。在此建议把 JavaScript 文件和网页文件放在同一个目录下。
JavaScript 文件不能够独立运行，需要导入到网页中，通过浏览器来执行。使用 <script> 标签可以导入 JavaScript 文件。
第4步，新建 HTML 文档，保存为 test.html。
第5步，在 <head> 标签内插入一个 <script> 标签。定义 src 属性，设置属性值为指向外部 JavaScript 文件的 URL 字符串。代码如下：

<script type="text/javascript" src="test.js></script>

注意：使用＜script＞标签包含外部 JavaScript 文件时，默认文件类型为 Javascript。因此，不管加载的文件扩展名是不是 .js，浏览器都会按 JavaScript 脚本来解析。

第6步，保存网页文档，在浏览器中预览，显示效果如图所示。

定义 src 属性的 <script> 标签不应再包含 JavaScript 代码。如果嵌入了代码，则只会下载并执行外部 JavaScript 文件，嵌入代码将被忽略。

JavaScript代码执行的顺序：

浏览器在解析HTML文档时，将根据文档流从上打下逐行解析和显示，JavaScript代码也是HTML文档的组成部分，因此JavaScript脚本的执行顺序也是根据<script>标签的位置来确定的。

使用浏览器测试下面实例，可以更加直观的看到JavaScript被逐步解析的过程。

<!DOCTYPE html>
<script>
    alert("顶部脚本");
</script>
<html>
<head>
    <meta charset="UTF-8">
    <title>test</title>
    <script>
        alert("头部脚本");
    </script>
</head>
<body>
    <h1>网页标题</h1>
    <script>
        alert("页面脚本");
    </script>
    <p>正文内容</p>
</body>
<script>
    alert("底部脚本");
</script>
</html>

在浏览器中浏览上面实例网页，首先弹出提示文本"顶部脚本"，然后显示网页标题"test"，紧接着弹出提示文本"头部脚本"，下面才显示一级标题文本"网页标题"，继续弹出提示文本"页面脚本"，接着显示段落文本"正文内容"，最后弹出提示文本"底部脚本"。

对于导入的JavaScript文件，也将按照<script>标签在文档中出现的顺序来执行，而且执行过程是文档解析的一部分，不会单独解析或者延期执行。

JS中如何注释：

1.单行注释：

在javaScript中我们可以使用//来进行注释，//只对当前行有效，如下：

document.write(23); //这里输出了一个23
//下面定义了两个变量
var x=20;
var y=23;

2.多行注释：

在JavaScript我们可以使用/**/来进行注释,其中/*是开头，*/是结尾，里面的所有内容都是注释，示例如下：

document.write("<h1>bilibili：https://www.bilibili.com/</h1>");
        /*document.write(23); 这里输出了一个23
        下面定义了两个变量
        var x = 20;
        var y = 23;*/

JavaScript的基本概念：

JavaScript的几个简单概念包括标识符，关键字，保留字，大小写和字面量，这些都是JavaScript的基本组成。

1.标识符：

标识符(Identifier),就是名字，JavaScript中的标识符包含了变量名，函数名，参数名，属性名，类名等等

定义标识符的时候应该注意的是:

第一个字符必须是字符，下划线(_)或美元符号($).
除了第一个字符以外，其他位置可以使用Unicode字符，一般建议使用ASCII编码的字母，不建议使用双字节的字符。
不能与JavaScript关键字，保留字重名。
可以使用Unicode转义序列，如字符a可以使用"\u0061"表示。

下面示例中，arr就是变量的名字：

var arr="https://www.bilibili.com/";
document.write(arr);

第一行代码定义了一个变量，名字为arr，第二行通过arr这个名字使用了变量。

2.关键字：

关键字(Keyword)是JavaScript语言内容的一组名字(或称为命令)，这些名字具有特定的用途，用户不能自定义同名的标识符，具体说明如表:

3.保留字：

保留字就是JavaScript语言内部预备使用的一组名字(或称为命令)，这些名字目前还没有具体的用途，是为JavaScript升级版预留备用的，建议用户不要使用，具体说明如表：

ECMAScript 3将Java所有关键字都列为保留字，而ECMAScript 5规定较为灵活，如：

在非严格模式下，仅规定class，const，enums，export，extends，import，super为保留字，其他ECMAScript 3保留字可以自由使用；

在严格模式下，ECMAScript 5变得更加谨慎，严格限制implements，interface，let，package，private，protected，public，static，yield，eval(非保留字)，arguments(非保留字)的使用。

JavaScript预定了很多全局变量和函数，用户也应该避免使用他们，如表：

不同的JavaScript运行环境都会预定义一些全局变量和函数，上表列出的是仅针对Web浏览器运行环境。

无论是在严格模式下还是在非严格模式下，都不要使用变量名，函数名或者属性名时使用上面的保留字，以免入坑。

4.区分大小写：

JavaScript严格区分大小写，所以arr和Arr是两个不同的标识符。

为了避免输入混乱和语法错误，建议采用小写字符编码写代码，在一些特殊情况可以使用大写形式：

1）构造函数的首字母建议大写。构造函数不同于普通函数。

2）如果标识符由多个单词组成，可以考虑使用驼峰命名法--除首个单词外，后面单词的首字母大写。

5.直接量：

字面量(Literal)也叫直接量，就是具体的值，即能够直接参与运算或显示的值，如字符串，数值，布尔值，正则表达式，对象直接量，数组直接量，函数直接量等等。

下面示例分别定义不同类型的直接量：字符串，数值，布尔值，正则表达式，特殊值，对象，数组和函数。

//空字符串直接量
1 //数值直接量
true//布尔值直接量
/a/g//正则表达式直接量
null//特殊值直接量
{}//空对象直接量
[]//空数组直接量
function(){}//空函数直接量，也就是函数表达式

最后祝愿大家一路前行不忘初心：

JavaScript简介-LMLPHP