第五次网页前端培训笔记 [P13-P19]

JavaScript

1. 简介

JavaScript是一种具有面向对象能力的、解释型的程序设计语言。更具体一点，它是基于对象和事件驱动并具有相对安全性的客户端脚本语言。它的主要目的是，验证发往服务器端的数据、增加Web互动、加强用户体验度等。

2.JavaScript的组成

ECMAScript（基础语法）：JavaScript的核心语法ECMAScript—描述了该语言的语法和基本对象

DOM（文档对象模型）：文档对象模型（DOM）——描述了处理网页内容的方法和接口

BOM（浏览器对象模型）：浏览器对象模型（BOM）——描述了与浏览器进行交互的方法和接口

3.基本用法

JS需要和HTML一起使用才有效果，我们可以通过直接或间接的方式将JS代码嵌入在HTML页面中。

行内JS：写在html标签内部的js代码

行内JS代码：<button οnclick="alert('you clicked hered!!!')">click here</button>

内部JS：定义在script标签内部的js代码,script标签可以放在head中或body中（建议放在body标签最后）

内部JS代码：<script type="text/javascript" charset="utf-8">

                                 alert('this is inner js code')

                         </script>

外部JS：单独的js文件，在HTML中通过script标签的src属性引入对应的JS文件

外部JS文件JS代码：hello.js

                                           alert('this is a outter js document')

                                      hello.html

                                            <!---在需要使用js的html页面中引入--->

                                            <script src="js/hello.js" type="text/javascript" charset="utf-8"></script>

4.基础语法

4.1 语句

JS代码一行为单位，代码从上往下执行，一行一条语句。

语句以分号结尾，一个分号即表示一个语句结束。表达式不需要分号结尾。

4.2 注释

单行注释：用//起头；

多行注释：放在/*和*/之间。

兼容html注释方式：<!-- -->

4.3 标识符

标识符就是一个名字，用来给变量和函数进行命名，有特定规则和规范

规则：

由Unicode字母、-、$、数字组成、中文组成

（1）不能以数字开头

（2）不能是关键字和保留字

（3）严格区分大小写

规范：

（1）见名知意

（2）驼峰命名或下划线规则

4.4 关键字

关键字也称保留字，是按JavaScript征用来有特殊含义的单词

声明变量时，不要使用关键字

4.5 变量

在声明变量时不需要指明数据类型，直接用var修饰符进行声明。

变量的声明和赋值：

//先声明再赋值

var a;

a=10;

//声明同时赋值

var b=20;

注意点：

（1）变量要有定义才能使用

（2）可以在同一条var命令中声明多个变量

var a,b,c=10;

console.log(a,b,c);

（3）若使用var重新声明一个已经存在的变量，是无效的。

var box=10

var box;

（4）若使用var重新声明一个已经存在的变量且赋值，则会覆盖掉前面的值。

var box=10;

var box=25;

4.6 数据类型

数值（Number）:整数和小数（比如1和3.14）

字符串（String）:字符组成的文本（比如“Hello World”）

布尔值（Boolean）：true（真）和false（假）两个特定值

Undefined：表示“未定义”或不存在，即此处目前没有任何值

Null：表示空缺，即此处应该有一个值，但目前为空

对象（object）（引用）：各种值组成的集合

（1）对象（object）{name:"zhangsan",age:"18"}

（2）数组（array）[1,2,3]

（3）函数（function）function test() {}

4.7 类型转换

自动类型转换

（1）转字符串：所有的值转字符串都是加引号

（2）转布尔型：有值为true，无值为false（0为false,非0为true）

（3）转数值型：空值是0，非空的数值型字符串能转换，非数值字符串转换为NaN

 函数转换

parseInt() 转整数型

parseFloat() 转浮点型

显示转换：

toString() 将值转换成字符串

toFixed() 保留指定小数位

注：值不能为null