JavaScript基础知识（二）JS内容

一、JS书写位置（与CSS类似）

（一）行内式

<input type="button"  value="点我试试"  
onclick="alert('Hello World')"/>

• 注意单双引号的使用：推荐HTML使用双引号，JS使用单引号
• 可以将单行或少量JS代码写在HTML标签的事件属性中（以on开头的属性）

（二）内嵌式

<script>
	alert('Hello World');
</script>

（三）外链式

<script src="my.js"> </script>

• 引用外部JS文件的script标签中间不可以写代码
• 适用于JS代码量比较大的时候

二、JS注释及输入输出

（一）JS注释

单行注释 // （ctrl+/）
多行注释 /* */

（二）JS输入输出语句

方法	说明
alert(msg)	浏览器弹出警示框
console.log(msg)	浏览器控制他打印输出信息
prompt(info)	浏览器弹出输入框，用户可以输入，默认为字符串类型

三、变量(类似C语言）

• 变量在内存中的存储本质：变量是程序在内存中申请的一块用来存放数据的空间
• 可以通过变量名获取数据，甚至可以修改数据

（一）变量使用

声明变量 var age;
var（variable）是一个JS关键字，用来声明变量，使用该关键字声明变量后，计算机会自动为变量分配内存空间，不需要程序员管。可以通过变量名访问内存中分配的空间
赋值 age=10;
变量值是程序员保存到空间的值

• 同时声明多个变量：只需要一个var，多个变量名中用英文逗号隔开
• 更新变量：一个变量被重新赋值后，它原有的值会被覆盖变量值以最后一次赋的值为准
• 只声明不赋值 输出 underfined(未定义的）
• 不声明只赋值 可使用
• 不声明不赋值，直接使用，会报错

（二）变量名规范

• 由字母、数字、下划线、美元符号组成
• 严格区分大小写，不能以数字开头
• 不能是关键字，保留字，要有意义
• 遵循驼峰命名法，首字母小写，后面单词的字母需要大写

四、数据类型

黑色为字符串，蓝色为数值，浅蓝为布尔型，灰色为undefined null

• 为了便于把数据分成所需内存大小不同的数据充分利用存储空间，定义了不同的数据类型
• JS是一种弱类型或者说动态语言，这意味着不用提前声明变量的类型，在程序运行过程中，类型会被自动确定，是由JS引擎根据等号右边变量的数据类型来判断的
• JS拥有动态类型，意味着相同变量可用作不同类型

（一）简单数据类型

数据类型	说明
Number	数字型包括整型值和浮点型值，默认为0
Boolean	布尔值类型(ture\f
String	字符串类型，JS中字符串都带引号，默认为" "
Undefined	声明变量未赋值，默认为undefined
Null	var a=null;声明变量a为空值，默认为null

1.数字型

• 数字型进制：在JS中八进制前面加o，十六进制前面加ox

• 数字型范围：最大值alert(Number.MAX_VALUE)
  最小值alert(Number.MIN_VALUE)

• 数字型特殊值：Infinity：无穷大，大于任何数值
  -Infinity：无穷小，小于任何数值
  NaN：代表一个非数值

• isNaN()：这个方法用来判断非数字，并返回一个值，如果是数字返回false,如果不是数字返回true

2.字符串型

• 可以是引号中的任意文本，其语法为双引号和单引号
• 字符串引号嵌套：JS可以用单引号嵌套双引号，或者用双引号嵌套单引号

a.字符串转义符（以\开头）

\n   换行
\\   斜杠\
\'	单引号
\"	双引号
\t	tab缩进
\b	空格

b.字符串长度

名字.length

c.字符串拼接

• 多个字符串之间可以使用加号+进行拼接，其拼接方式为 字符串+任何类型=拼接后的新字符串
• 数值相加，字符相连
• 经常会将字符串和变量来拼接，因为变量可以方便修改值
• 变量不能加引号（引引加加，两侧都有字符串）

3.布尔型Boolean（true false）

布尔型和数字型相加时，true的值为1，false的值为0

4.Undefined

一个声明后没有被赋值的变量默认为undefined

5.null

一个声明变量给null值，里面存的值为空

字面量

• 在源代码中，一个固定值的表示方法，通俗来说，就是字面量表示如何表达这个值
• typeof 变量名 ，可以得到变量类型

（二）数据类型转换值

• 使用表单prompt获取过来的数据默认是字符串类型的，不能直接简单的进行加法运算，而需要转换数据类型
• 标识符：开发人员为变量属性参数取的名字（不能是关键字或保留字）
• 关键字：指JS本身已经使用的字，不能用作变量名、方法名（break，case，default，catch等）
• 保留字：实际上是预留的关键字，意思是现在还不是关键字，但未来可能是关键字（Boolean,byte,char,class,const,double等）

1.转换为字符串

toString()   例：var num=1; alert(num.toString());
String()强制转换  例：var num=1; alert(String(num));
加号拼接字符串  例：var num=1； alert(num+"我是字符串");

2.转换为数字型

parseInt(String)	 例：parseInt('78');
parseFloat(String)	例：parseFloat('78.21');
Number()	例：Number('12');
隐式转换(- * /) 	例：'12'-0

3.转换为布尔型

Boolean() 	例：Boolean('ture');

五、运算符和流程语句(类似C语言）

（一）运算符

1.算术运算符

• 算术运算符：+、-、*、/、%
• 浮点数在算数运算中会有问题，浮点数值的最高精度是17位小数，但在进行算数计算时，其精度远远不如整数
• 不要直接判断两个浮点数是否相等

2.递增和递减运算符

++num; num++;
单独使用是二者效果一致，等价于num=num+1;
若不是单独使用，++num;先自加1，后返回值/ /num++;先返回原值，后自加1

3.比较运算符

比较(关系)运算符：>、<、>

=、<=、==（判断号（会转数据类型））、!=、=== !==（全等，要求值和数据类型都一致）

4.逻辑运算符

用来进行布尔值运算的运算符，其返回值也是布尔值

5.短路运算（逻辑中断）

逻辑与（语法：表达式1 && 表达式2） 若表达式1为真，则返回表达式2的值；若表达式1为假，则返回表达式1的值
逻辑或（语法：表达式1||表达式2）若表达式1为真，则返回表达式1的值；若表达式1为假，则返回表达式2的值

6.赋值运算符

用来把数据赋值给变量的运算符，如：=、 += 、-=、 *=、 /= 、%=

（二）流程控制

条件语句：if 语句 if-else语句 if-else if-else语句  switch语句
循环语句：for语句 while语句 do-while语句 
三元表达式：条件表达式?表达式1:表达式2
contiune：跳出本次循环，继续下一次循环
break：立即跳出整个循环

六、数组

1. 创建数组

利用new创建数组
var arr = new Array(); 注意Array()中A要大写
利用数组字面量创建数组
var 数组名=[]; 数组中可存放任意类型的数据

2. 数组的索引（下标，从0开始）

console.log(arr [2]);

3. 数组长度：数组名.length可访问数组长度

4. 输出多个变量

console.log(sum,average);

5. 数组中新增元素

• 修改length长度实现数组扩容：arr.length=5;
• 修改数组索引新增数组元素：arr[3]=‘hihi’;

七、函数

（一）函数使用

函数不调用自己不执行

声明函数（两种）

function 函数名() {
函数体
}
函数表达式
var 变量名=function(){};
调用函数
函数名();

（二）函数参数

function 函数名(形参1，形参2）{
	函数体
}
函数名(实参1，实参2);

函数形参和实参个数

• 一样多，正常输出
• 实参个数多于形参个数，会取到形参个数
• 实参个数少于形参个数，多于形参定义为undefined，结果为NaN

函数的封装：把一个或多个功能通过函数的方式封装起来，对外只提供一个简单的函数接口
函数可以调用另一个函数

（三）函数返回值（return语句）

function 函数名() {
	return 需要返回的结果；
}
函数名();

• return终止函数：return 后面的代码不会被执行
• return只能返回一个值，返回结果是最后一个值
• return[1+2,1-2,1*2,1/2]是返回数组
• 函数没有return则返回undefined

（四）arguments的使用

• 当不确定有多少个参数传递是可以用arguments来获取
• arguments实际上是当前函数的一个内置对象，所有函数都内置了一个arguments对象，arguments对象中存储了传递的所有实参
• arguments展示形式是一个伪数组，可以进行遍历，伪数组就有以下特点：a.具有length属性；b.按索引方式储存数组；c.不具有数组的push,pop等方法

八、事件

（一）事件概述

• 事件源：被监听的html元素（就是这个事件要加给谁），就是某个（某些）html标签
• 事件类型：某类动作，例如点击事件，移入移除事件，敲击键盘事件
• 执行指令：事件触发后需要执行的代码，一般使用函数进行封装
• 语法格式：事件源.事件类型=执行指令

（二）常用事件

事件名	描述
onload	某个页面或图像被完成加载
onsubmit	当表单提交时触发该事件
onclick	鼠标点击某个对象
ondbclick	鼠标双击某个事件
onblur	元素失去焦点，通常针对表单元素
onfocus	元素获得焦点，通常针对表单元素
onchange	用户改变域的内容，通常针对表单元素