JavaScript基础

最新推荐文章于 2021-01-29 17:17:08 发布

原创最新推荐文章于 2021-01-29 17:17:08 发布 · 337 阅读

0 ·

CC 4.0 BY-SA版权

为什么学习JavaScript?

JavaScript在网页制作中占有非常重要的地位，可以实现验证表单、制作特效等功能，总结起来，学习JavaScript的目的主要基于以下三点：客户端表单验证、页面动态效果、jQuery的基础。

什么是JavaScript？

JavaScript是一种描述性语言，也是一种基于对象(Object)和事件驱动(Event Driven) 的，并具有安全性能的脚本语言。它与HIML (超文本标记语言)一起，在一个Web页面中链接多个对象，与Web 客户实现交互。无论在客户端还是在服务器端，JavaScript 应用程序都要下载到浏览器的客户端执行，从而减轻了服务器端的负担。总结其特点如下。

JavaScript主要用来在HTML页面中添加交互行为。

JavaScript是一种脚本语言，语法和Java类似。

JavaScript一般用来编写客户端的脚本。

JavaScript是一种解释性语言，边执行边解释。

JavaScript的组成：

ECMAScript 标准

ECMAScript 是一种开放的、被国际上广为接受的、标准的脚本语言规范。它不与任何具体的浏监器绑定。ECMASeript标准主要描述了以下内容。

语法。

变量和数据类型。

运算符。

逻辑控制语句。

关键字、保留字。

对象。

ECMAScript 是一个描述，规定了降本语言的所有属性方法和对象的标准，因此在使用Web客

户端脚本语言编玛时一定要遵循ECMAScript 标准。

浏览器对象模型

浏览器对象模型(Browser Object Model,BOM)，提供了独立于内容与浏览器窗口进行交互的对象，使用浏览器对象模型可以实现与HTML 的交互，如网上常见的弹出窗口，前进后退等功能都是浏览器对象控制的。

文档对象模型

文档对象模型(Document Object Model,DOM),是HTML 文档对象模型(HTML DOM) 定义的一套标准方法，用来访问和操纵HTML 文档，如网上商城常见的随鼠标移动显示大的图片、弹出小提示等都是文档对象的功劳。

JavaScript 的基本结构

JavaScript 语句;

</script >

其中type 是<script>标签的属性，用于指定文本使用的语言类别为text/JavaScript。

注意:

有的网页中用默认type=“text/Javascript”,这种写法是正确的,因为HTMLS 中可省略type 属性，HTML5 默认为text/Javascript。

JavaScript的执行原理

使用客户端脚本的好处有以下两点。

包含JavaScript的页面只要下载一次即可，这样能减少不必要的网络通信。

JavaScript 程序由浏览器客户端执行，而不是由服务器端执行的，因此能减轻服务器端的压力。

嵌入网页时有三种方式：

1.内部JavaScript 文件：直接使用<script>标签将JavaScript 代码加入HTML 文档中。这是最常用的方式，但这种方式通常适用于JavaScript 代码较少，并且网站中的每个页面使用的JavaScript 代码均不相同的情况。

关键代码：

<!--<script type="text/javascript">
    document.write("初学JavaScript");
    document.write("<h1>初学JavaScript</h1>");
</script>-->

2.使用外部JavaScript 文件：在实际工作中，有时会希望在若干个页面中实现相同的JavaScript 效果，针对这种情况，再使用内部JavaScript 文件就会使代码冗余，而使用外部JavaScript 文件就不一样了，JavaScript 可以在多个页面重复使用。外部JavaScript 文件是将JavaScript 代码写入一个外部文件中，以*.js 为扩展名保存，然后将该文件指定给<script>标签中的“src”属性，这样就可以使用这个外部文件了。这种方式与在网页中引用外部样式类似。

关键代码：

3.直接在HTML标签中

关键代码：

通过以上可以知道这三种方式的应用场合:

内部JavaScript 文件适用于JavaScript 特效代码量少，仅用于单个页面。

外部js 文件则适用于代码较多，重复应用于多个页面。

直接在标签中写JavaScript 则适合于极少代码，仅用于当前标签，但是这种方式增加了HTML代码，因此这种方式在实际开发中应用较少。

JavaScript 核心语法

变量的声明和赋值

JavaScript 是一种弱类型语言，没有明确的数据类型，也就是说，在声明变量时，不需要指定变
量的类型，变量的类型由赋给变量的值决定，这一点不像Java 和C#那样，在声明交量的同时网指
定变量的数据类型。
在JavaScript中，变量是使用关键宇声明的。下面是JavaScript声明变量的语法格式，
语法
var 合法的变量名;
其中，var是声明变量所使用的关键字，“合法的变量名”是遵循JavaScript变量命名规则的变量
名。JavaScript变量命名与Java变量的命名规则相問，即可以由数字，母下划线和“S”符号组
成，但首字母不能是数字，并且不能使用关键字命名。可以在声明变量的时为变量赋值，这称为
变量的初始化: 也可以在稍后的脚本中为变量赋值。
声明变量的同时为变量赋值，例如

var width=20;//在声明变量width的同时，将数值20赋给了变量width
var x，Y，z=10;//在一行代码中声明多个交量时，各变量之间用逗号分隔
需要强调的是，JavsScript区分大小写，所以大小写不同的变量名表示不同的变量。另外，由于
JavaScript是一种弱类型语言，因此允许不声明交量而直接使用，系统将会自动声明该变量，例如，
x= 88 ;//没有声明变量x，直接使用
规范:
千万要注意JavaScript区分大小写，特别是变量的命名、语句关键字等，这种错误有时很难查找。
交量可以不经过声明而直接使用，但这种方法很容易出错，也很难查找排错，因此不推荐使用。在使用变量之前，请先声明后使用，这是良好的编程程习惯。
数据类型

1.topeof

EOMSGO提供了typeof 运算符来判断一个值或变量究竟属于哪种数据类型。语法格式如下:
语法
typeof (变量或值)

其返回结果有以下几种。

ndefined: 如果变量是undefined 类型的，则返回undefined 类型的结果。number:如果变量是number类型的，则返回number类型的结果。String: 如果变量是Sring类型的，则返回String类型的结果。
boolean: 如果变量是boolean类型的，则返回boolean 类型的结果。
object; 如果变量是null 类型，或者变量是一种引用类型，如对象、函数、数组，则返回object类型的结果。
2.undefinde类型

3.null类型
4.number类型

5.String类型

6.boolean类型

数组

1.创建数组

语法

var 数组名称 =new Array(size);

2.为数组元素赋值

语法

var fruit =new Array("apple","orange","peach","banana");

3.访问数组元素

可以通过数组的名称和下标直接访问数组的元素，访问数组的表示形式: 数组名[下标。创如fruit [0]表示访问数组中的第一个元素，fruit 是数组名，0 表示下标。

4.数组的常用属性和方法

数组是JavaScript 中的一个对象，它有一组属性和方法，表1-2 所示为数组的常用方法和属性

运算符号

逻辑控制语句

1.条件结构

if结构

语法

if(表达式){

//JavaScript语句1；

}else{

//JavaScript语句2；

}

switch结构

语法

switch(表达式){

case 值1：

//JavaScript语句1；

break;

case 值2：

//JavaScript语句2；

break;

...

default:

//JavaScript语句n；

break;

}

2.循环结构

for循环语句

语法

for(初始化;条件;增量或减量){

//JavaScript语句；

}

while循环语句

语法

while(条件){

//JavaScript语句；

}

do-while循环语句

语法

do{

//JavaScript语句；

}while(条件);

for-in循环

语法

for(变量in对象){

//JavaScript语句；

}

中断循环

同Java一样，在JavaScript 标准语法中也有两种特殊的语句可以用于循环内部，用来终止循环:

break 和continue。

break: 可以立即退出整个循环。

continue:只是退出当前的循环，根据判断条件决定是否进行下一次循环。

JavaScript 常用语法---函数

常用系统函数

把非数字的原始值转换为数字的函数，即parseInt()和parseFloat()。

1.parseInt()

parseInt()函数可解析一个字符串，并返回一个整数

语法

parseInt("字符串")

在判断字符串是否为数字前，parseInt()和parseFloat()都会分析该字符串。

2.parseFloat()

parseFloat()函数可解析一个字符串，并返回一个浮点数

语法

parseFloat("字符串")

3.isNaN()

isNaN()函数用于检查其参数是否是非数字

语法

isNaN(x)

如果x是特殊的非数字值，则返回值是true，否则返回false。

自定义函数

1.定义函数
在JavsSarin中，自定义函数由关键宇function函数名、一组参数及置于括号中的待执行的
JaveSript 语句组成，语法格式如下。
语法
function 函数名(参数1，参数2,参数3..) {
//JavaScript 语句;
[return 返回值]

}
function 是定义函数的关键字，必须有。
参数1、参数2 等是函数的参数。因为JavaScript本身是弱类型，所以它的参数也没有类型
检查和类型限定。函数中的参数是可选的，根据函数是否带参数，可分为不带参数的无参函
数和有参函数。例如，无参函数:
function 函数名( ){
//JavaScript 语句;

}
"{~ 和“}”定义了函数的开始和结束。
return 语句用来规定函数返回的值。
2.调用函数
要执行一个函数，必须先调用这个函数，当调用函数时，必须指定函数名及其后面的参数(如
果有参数)。函数的调用一般和元素的事件结合使用，语法格式如下。
语法
事件名 ="函数名( )";
事件