JavaScript基本语法：JS简介&变量

男娘i 2022-04-22 00:16 239阅读 0赞

**1.JavaScript简介**  
javascript最初由网景公司的Brendan Eich设计，是一种动态，弱类型，基于原 型 的语言，内置支持类。经过近二十年的发展，它已成为健壮的基于对象和事件驱动并具有相对安全性的客户端脚本语言。 同时，Javascript也是一种广泛应用于客户端web开发的脚本语言常用来给HTML网页添加动态功能，比如响应客户端的的各种操作等。javascript可弥补HTML语言的缺陷， 实现Web页面客户端的动态效果，其主要内容如下：  
Javsript可弥补如下。  
**(1)动态改变网页内容**  
HTML语言是静态的，一旦编写，以将内容动态地显示在网页中，  
**(2) 动态改变网页的外观**  
javascript通过修改网页元素的CSS样式，达到动态地改变网员外观的目的。例如，修改文本的颜色，大小等属性，以及图片的动态效果等  
**(3) 验证表单数据**  
为了提高网页的效率，用户在填写表单时，可以在客户端对数据进行合法性验证，验成功之后才能提交到服务器上，进而减少服务器的负担和网络带宽的压力。  
**(4)响应事件。**  
JavaSeript是基于事件的语言，因此可以影响用户或浏览器产生的事件。只有事件产生会执行某段 JavaSeiprt代码，例如只有 当用户在单击程序按钮时，程序才显示运行结果。  
**几乎所有测览器都支持javascript例如IE. Firefox.Netscape. Mozill、 Opera 等**，

**2 JavaScript 的特点**  
JavaSeript的特点主要有以下几个方面。  
**(1)语法简单，易学易用。**  
javaScript语法简单、结构松散，可以使用任何一种文本编辑器进行编写。用javascript编写的程序在运行时不需要编译成二进制代码，只需要支持javascript的浏览器能够对其进行解释即可。  
**（2）解释性语言。**  
非脚本语言编写的程序通常需要经过编写-编译-链接-运行，而脚本语言JavaScript只需要经过编写一运行2个步骤。  
(**3) 跨平台。**  
由于JavaScript 程序的运行依赖于浏览器，只要操作系统中安装有支持JavaScript的浏览器即可，因此JavaSeript与平台(例如，Windows 操作系统、UNIX操作系统、Linux 操作系统、Android操作系统、iPhone操作系统等)无关。  
**4)基于对象和事件驱动。**  
JavaScript 把HTML页面中的每个元素都当作一个对象来处理，并且这些对象都具有层次关系，像一棵倒立的树，这种关系被称为“文档对象模型(DOM)”。在编写JavaScripe 代码时会接触到大量对象及对象的方法和属性。可以说学习JavaScript 的过程，就是了解JavaSerin对象及其方法和属性的过程。因为基于事件驱动，所以JavaScript可以捕捉到用户在浏览器的操作，可以将原来静态的HTML页面变成能跟用户交互的动态页面。  
**(5) 用于客户端。**  
尽管JavaScript分为服务器端和客户端两种，但目前应用最多的还是客户端。

**3 JavaScript与Java的区别**  
JavaScript是一种嵌入式脚本文件，直接插入网页，由浏览器边解释一 边执行: 而语言必须在Java虚拟机上运行，H事先需要进行编译。另外，Java的语法规则要比JavaS严格得多，功能也比JavaScript强大得多。具体来讲，JavaScript与Java的主要区别如下。  
**1.基于对象和面向对象**  
JavaScript是一种基于对象的脚本语言， 是种基 于对象和事件驱动的编程语言，因本身提供了非常丰富的内部对象供设计人员使用。  
Java是面向对象的，即Java是一种真正的面 向对象的语言，即使是开发简单的程序也必须设计对象。  
**2.强变量和弱变量**  
JavaScript 与Java所采取的变量是不一样的。JavaScript 中的变量声明采用弱类型在使用前不需作声明，而是解释器在运行时检查其数据类型。  
Java采用强类型变量检查，即所有变量在编译之前必须作声明。例如下面这段代

var a="hello"
    string b="wolrd"

**4.JavaScript语法**

1.  语句之间用分号隔开
2.  JavaScript是按照代码编写的顺序依次执行的
3.  JavaScript对大小写敏感
4.  JavaScript会忽略多余的空格
5.  JavaScript的标识符必须由字母下划线或$开头
6.  JavaScript的注释有两种//单行注释/\* \*/多行注释

**5.JavaScript的组成**  
JavaScript基础分为三个部分：

1.  ECMAScript：JavaScript的语法标准。包括变量、表达式、运算符、函数、if语句、for语句等。
2.  DOM：操作网页上的元素的API。比如让盒子移动、变色、轮播图等。
3.  BOM：操作浏览器部分功能的API。比如让浏览器自动滚动。

**6.JavaScript变量**  
1.弹出警告框

![效果][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2R3ZWJsb3Zlcg_size_16_color_FFFFFF_t_70]  
2.控制台输出

![效果][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2R3ZWJsb3Zlcg_size_16_color_FFFFFF_t_70 1]

3.用户输入

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2R3ZWJsb3Zlcg_size_16_color_FFFFFF_t_70 2]  
![效果][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2R3ZWJsb3Zlcg_size_16_color_FFFFFF_t_70 3]  
3.变量  
var是英语“variant”变量的缩写。后面要加一个空格，空格后面的东西就是“变量名”  
定义变量：var就是一个关键字，用来定义变量。所谓关键字，就是有特殊功能的小词语。关键字后面一定要有空格隔开。

变量的赋值：等号表示赋值，将等号右边的值，赋给左边的变量。
    
    变量名：我们可以给变量任意的取名字。

注：在JavaScript中，永远都是用var来定义变量，这和C、Java等语言不同。  
**例**

**下图可以看出各个变量的类型**  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2R3ZWJsb3Zlcg_size_16_color_FFFFFF_t_70 4]  
**String变量**  
连字符和加号的区别  
键盘上的+可能是连字符，也可能是数字的加号。如下：注意后三个区别

![效果][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2R3ZWJsb3Zlcg_size_16_color_FFFFFF_t_70 5]  
**通过上图输出结果可以得出结论：如果加号两边都是数值，此时是加。否则，就是连字符（用来连接字符串）。**

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2R3ZWJsb3Zlcg_size_16_color_FFFFFF_t_70]: /images/20220422/557e0a472bfd44848d46f608f43e1143.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2R3ZWJsb3Zlcg_size_16_color_FFFFFF_t_70 1]: /images/20220422/badf04486b544b4794733c23bcb0b399.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2R3ZWJsb3Zlcg_size_16_color_FFFFFF_t_70 2]: /images/20220422/732387e74ace4406a2568a32eb7207df.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2R3ZWJsb3Zlcg_size_16_color_FFFFFF_t_70 3]: /images/20220422/76bcf121c63941859d63c258d896709e.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2R3ZWJsb3Zlcg_size_16_color_FFFFFF_t_70 4]: /images/20220422/8fcf42cc0d984241a5365294a9324617.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L2R3ZWJsb3Zlcg_size_16_color_FFFFFF_t_70 5]: /images/20220422/5df5ff96f09840e78d25b433213438b8.png