JavaScript的使用

1、介绍

js是一种基于对象和事件驱动、并且具有相对安全性的客户端脚本语言，是一种弱语言

js的主要目的是验证发往服务器端的数据、增加web互动、加强用户体验度等。

组成部分

ECMAScript(基础语法)

ECMAScript定义的只是这门语言的基础，与web浏览器没有依赖关系

javascript的核心语法ECMAscript描述了该语言的语法和基本对象

DOM（文档对象模型）

描述了处理网页内容的方法和接口

DOM定义了表示和修改文档所需的对象、这些对象的行为和属性以及这些对象之间的关系。DOM属于浏览器，而不是Javascript语言规范里的规定的核心内容。

BOM（浏览器对象模型）

DOM是为了操作浏览器中的文档，而为了控制浏览器的行为和操作，浏览器还提供了BOM。

2、ECMAScript

基础语法

1、行内js

将代码写在html标签上，相当于css的style，js使用onclick表示

onclick表示点击事件，当点击元素时触发

2、内部js

写在html页面的script标签中，推荐放在body标签后

3、外部js

创建js文件，通过script标签引入js文件

输入输出：

输出：

利用js向页面显示一些内容：document.write（“要显示的内容”）；

document.write（“图片：”）;

console.log（“”） 打印内容在控制台，在控制台显示打印

输入：

prompt（“请输入数字”）；

会弹出一个输入框，框的标签就是双引号里面的内容

prompt是将用户输入的信息全部转换为字符串，而不是数字

弹出：

alert（“内容”）弹出框

变量的定义与使用

js是一种弱语言，在声明变量时不用指定数据类型，直接使用var修饰符声明变量

当变量只声明未赋值的时候返回的是undfinded

定义： var 变量名 = 内容；

输出：document.write（变量名）；

字符串数字转换成数字：parseInt（）；

parseInt（）转换只是把里面的字符串转换成了数字，并不会改变原有的变量

例如：

var a = "12";
parseInt(a);
document.write(a+12);
//输出1212

如果需要运算加法则需要新的变量来接受parseInt（）；转换的变量

var a = "12";
var b = parseInt(a);
document.write(b+12);
//输出24

在js中如果先输出打印再定义变量是可以输出不会报错的，这叫做变量提升，

console.log（“name”）；
var name = “张三”；

变量提升是针对用var定义的变量，在编译的时候会把这个变量提升到代码最前面

变量提升只针对使用var定义的变量，且先输出的是undfinded未赋值

数据类型

虽然说js是弱语言，变量没有类型，但数据本身是有类型的，针对不同的类型，我们可以进行不同的操作。

javascript中有六种数据类型，其中有五种简单的数据类型：undefined、null、布尔、数值和字符串，一种复杂数据类型object。

使用typeof操作符测试数据类型

使用方法：type 数据；

数值（number）：整数和小数
字符串（string）：字符串和文本
布尔值（boolean）：true和false两个特定值
undefined：表示未定义或者不存在，即此处目前没有任何值
null：表示空缺，即此处应该有一个值，但目前为空
对象object（引用）：各种组成的集合
    （1）、对象
    （2）、数组
    （3）、函数

undefined：

表示不存在，出现情况：

1、当申明了变量但未赋值时

2、调用函数（方法）时，函数有形参，但未提供实参

3、函数没有返回值

null：

表示空值，使用注意：

1、使用typeof测试null返回的是object字符串。

2、undefined派生自null，所以两者比较返回值是true。

数值型：

1、所有数字都是以64位浮点型存储的，所以在js中1与1.0是相等的

2、浮点类型最高精度是17位，浮点类型运算时可能不准确，不建议使用浮点型做判断

3、在存储数据时会自动将浮点数值1.0转换成1，1+1.0的值为2。

字符串：

字符串使用单引号双引号是都可以的

类型转换

函数转换

js提供了parseint（）和parsefloat（）两个全局转换函数，前者把值转换成整数，后者把值转换成浮点数，只有对string类型调用这个方法，这两个数值才能正确运行，其他返回类型都是NaN(not a number)

parseint（）

在转换之前，首先会分析该字符串，判断位置为0处的字符，如果不是就返回nan，是的话就继续判断，直到结束或者找到非字符结束

parseint("123abs");//返回123
parseint("1234");//返回1234
parseint("ble");//返回nan

parsefloat（）

该方法与parseint（）方法的处理方式相同，但是对于这个方法来说，第一个出现的小数点是有效字符，第二个出现会被看作无效的

parsefloat（“123blue”）；//返回123.0
parsefloat（“1234”）；//返回1234.0
parsefloat（“123.45”）；返回123.45
parsefloat（“123.45.67”）；//返回123.45
parsefloat（“blue”）；//返回nan

注意：

var a = 123ab;
var b = parseInt（a）；
alert(a);//输出123ab
alert(b);//输出123

因为parstint是一个函数转换，它只是把当前这个值转换成为整数值，并不是把变量的值改变了。所以需要输出转换的值需要一个新的变量来接收它。

显示转换

显示转换有两个方法，是方法所以就需要一个变量来使用这个方法，当变量没有值为null时也就不可以使用了。

tostring（）；将内容转换为字符串形式

tofixed（）；根据小数点后指定位数将数字转换成字符串

//tostring
var a = 10;
document.write(a.tostring())
//输出10字符串
​
//tofixed()
var b = 1.234;
document.write(a.tofixed(1))
//输出1.2字符串

js也为number、boolean、string对象提供了构造方法，用于强制转换成其他数据类型，此时操作的是整个数据，而不是部分

例如：

Number（false）//输出0
Number（undefined）//输出nan
Number（null）//输出0
Number（“5.6.7”）//输出nan
Number（new object（））//nan
​
Boolean（“”）//false
Boolean（“hi”）//true
Boolean（100）//true
Boolean（null）//null
Boolean（0）//false
Boolean（new object（））//true
​
​
//将任意值转换成字符串，包括null和undefinded
var q = null；
document.write（string（q））
输出null字符串

运算符和控制语句

运算符和控制语句都是和Java一样，其中最需要注意的就是==和===

== 相等，比较值是否相等

===全等，比较值和类型是否相等

var a = 1;
var b = "1";
alert(a==b)//true
alert(a===b)//fales

数组

数组的定义

var arr = [值1，值2，值3] //隐式创建

var arr = new Array（值1，值2，值3）；//直接实例化

var arr = new Array（长度）//创建数组且指定长度

特点

1、长度可变

2、数组中数据类型任意

3、索引从0开始

4、可以使用任意字符当作数组的索引，如果索引是非正整数，我们称之为属性，属性不占据长度

数组遍历

1、一种普通for循环，不会去取索引

2、 一种数增强for循环，var 下标名 in 数组名，会打印属性 ，不遍历undefined

3、还有一种是foreach结构：

数组名.forEach（function（element，index））{

//element（名称任意）：元素

//index（名称任意）：下标

这种也不会遍历属性和undefined

数组方法

push 添加元素到最后

unshift 添加元素到最前

pop 删除最后一项

shift 删除第一项

reverse 数组翻转

join 数组转换成字符串

indexof 数组元素索引

slice 截取数组，原数组不发生改变

splice 剪接数组，原数组变化，可以实现前后删除效果

concat 数组合并

函数

函数定义

1、函数声明语句：

function 函数名（参数列表）{}

2、函数定义表达式：

var 变量名 = function（参数列表）{}

3、function构造函数：

var 变量名 = new function（‘变量1’，‘变量2’，‘return（想要的结果，如变量1+变量2）’）；

注意：

1、如果使用函数声明语句这种方式，这回又函数提升的效果

2、js中方法没有重载，如果出现同方法名则覆盖

函数作用域

js的作用域只有在函数中才能体现

if(true){
    var a = 1;
}
alert(a);//输出1

比如在这种情况，在Java中输出a的值是会报错的，因为a的作用只