javaScript基本语法

javaScript基本语法

---

---

前言

• JavaScript是一门解释型语言，所谓的解释性语言不需要被编译为机器码在执行，而是直接执行
• javaScript也是一门面向对象语言
• JavaScript主要是JavaScript用于响应用户操作

---

一、编写位置

1.1 行内式

<script type="text/javascript">
		//内嵌式
 	</script>

1.2 内嵌式

<input type="button" value="点我" onclick="alert('行内式')">

1.3 外链式

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

二、输出语句三种方式

2.1 alert()

该语句会在浏览器窗口中弹出一个警告框

2.2 document.write()

该内容将会被写到body标签中，并在页面中显示

2.3 console.log()

该内容会被写到开发者工具的控制台中

三、基本语法

3.1 注释

单行注释：//注释内容
多行注释：/* 注释内容 */

3.2 字面量和变量

字面量

• 字面量就是一些固定的值
• 字面量是不可以改变的

变量

-可以用来保存字面量并且还是任意数量

声明变量：使用var关键字

var a = 123;
var b = 456;

3.3 标识符

理解：在js中所有的可以自主命名的内容，都可以认为是一个标识符，我们在使用标识符时就必须遵守标识符的命名规则

• 第一个字符必须是一个字母、下划线(_)或一个美元符号($)
• 不能以数字开头
• 可以含有字母、数字、下划线、$
• 不能是js中的关键字和保留字
• 一般使用驼峰命名法（xxxYyyZzz）

(为了让大家对关键字和保留字有点印象，为此找到一下图片义工大家参考关键字和保留字)

3.3 数据类型

String	字符串
Number	数值
Boolean	布尔值
Null	空值
Undefined	未定义
Object	对象

3.4 String 字符串

• 在字符串使用 \ 作为转义符

字符串需要使用单引号或双引号引起

\n	换行
\t	制表
\b	空格
\r	回车
\ \	斜杠
\ ’	单引号
\ "	双引号

使用typeof运算符检查字符串时，会返回"string"

3.5 Number 数值

js中所有的整数和浮点数都是Number类型

特殊的数字
Infinity 正无穷
-Infinity 负无穷
NaN 非法数字（Not A Number）

其他进制的数字的表示：
0b 开头表示二进制，但是不是所有的浏览器都支持
0 开头表示八进制
0x 开头表示十六进制

使用typeof检查一个Number类型的数据时，会返回"number"（包括NaN 和 Infinity）

3.6 Boolean 布尔值

布尔值主要用来进行逻辑判断，布尔值只有两个

true	真
false	假

使用typeof检查一个布尔值时，会返回"boolean"

3.7 Null 空值

空值专门用来表示为空的对象，Null类型的值只有一个

使用typeof检查一个Null类型的值时会返回"object"

3.8 Undefined 未定义

该类型的值只有一个 undefined

使用typeof检查一个Undefined类型的值时，会返回"undefined"

四、 类型转换

类型转换就是指将其他的数据类型，转换为String Number 或 Boolean

4.1 转换为String

方式一 调用 toString 方法：

var a = 123;
a = a.toString();

方式二 调用 String() 函数 ：

var a = 123;
a= String(a);

注意：
1、我们在使用toString()方法时，不能放在null和undefined中使用，因为在这两个类型中是没有方法的，但是是可以调用String()函数的
2、我们使用的 toString() 和 String() 方法都是强制类型转换

方式三 (隐式的类型转换) ：

var a = bbb;
//原理就是为任意类型 + ""
//为a + ""
a = a + "";

4.2 转换为Number

方式一 调用 Number() 函数：

var a = "123";
a = Number(a);

转换情况：
1、字符串 --> 数字

1、如果字符串是一个合法的数字，则直接转换为对应的数字
2、如果字符串是一个非法的数字，则转换为NaN
3、如果是一个空串或纯空格的字符串，则转换为0

2、布尔值 --> 数字

1、true转换为1
2、false转换为0

3、空值 --> 数字

null转换为0

4、undefined --> 数字

undefined 转换为NaN

方式二 调用 parseInt() 或 parseFloat():

parseInt():
可以将一个字符串中的有效整数位提取出来并转换为Number

var a =  "3.1415aaa"
a = parseInt(a);//3

parseFloat():
可以将一个字符串中的有效的小数位提取出来，并转换为Number

var a =  "3.1415aaa"
a = parseFloat(a);//3.1415

注意;
调用 parseInt() 或 parseFloat() 都是属于强制类型转换

方式三（隐式的类型转换）：

var a = "123";
a = +a;//123

4.3 转换为布尔值

方式一 使用Boolean()函数（强制类型转换）：

var a = "false";
a = Boolean(a);//true

转换的情况：

1、字符串 --> 布尔
除了空串其余全是true

2、数值 --> 布尔
除了0和NaN其余的全是true

3、null、undefined —> 布尔
都是false

4、对象 —> 布尔
都是true

方式二（隐式类型转换）：

为任意的数据类型做两次非运算，即可将其转换为布尔值

var a = "hello";
a = !!a;//true

五、 运算符

5.1 算数运算符

运算符也称为操作符
通过运算符可以对一个或多个值进行运算或操作

+	加法
-	减法
*	乘法
%	取模
++（前置）	自增
++（后置）	自增
- - （前置）	自减
- - （后置）	自减

• 除了加法以外，对非Number类型的值进行运算时，都会先转换为Number然后在做运算
• 做加法运算时，如果是两个字符串进行相加，则会做拼串操作，将两个字符连接为一个字符串
• 任何值和字符串做加法，都会先转换为字符串，然后再拼串

自增

• 自增可以使变量在原值的基础上自增1
• 自增可以使用 前++（++a）后++(a++)
• 无论是++a 还是 a++都会立即使原变量自增1

区别前置++ 和 后置++

• ++a的值是变量的新值（自增后的值）
• a++的值是变量的原值（自增前的值）

自减

• 自减可以使变量在原值的基础上自减1
• 自减可以使用 前++（++a）后++(a++)
• 无论是–a 还是 a–都会立即使原变量自减1

区别前置- - 和 后置- -

(- -a)的值是变量的新值（自减后的值）
(a- -)的值是变量的原值（自减前的值）

5.2 逻辑运算符

非 (!)

• 非运算可以对一个布尔值进行取反
• 非运算符可以应用于任意值，无论值是什么类型，这个运算符都会返回一个布尔值

与 (&&)

• 对于非布尔值，它会将其转换为布尔值然后做运算，并返回原值
• 只有两端的值都为true时，才会返回true，只要有一个false就会返回false
• 与是一个短路的与，如果第一个值是false，则不再检查第二个值

或 ( || )

• 对于非布尔值，它会将其转换为布尔值然后做运算，并返回原值
• 只有两端都是false时，才会返回false，只要有一个true，就会返回true
• 或是一个短路的或，如果第一个值是true，则不再检查第二个值

5.3 赋值运算符

=	将符号右侧的值赋值左侧
+=	a += 1 => a = a +1
-=	a -= 1 => a = a - 1
*=	a *= 1 => a = a * 1
/=	a /= 1 => a = a / 1
%=	a %= 1 => a = a % 1

5.4 关系运算符

1、用于比较两个值之间的关系
2、比较结果成立返回true，反之返回false
3、如果比较的两个值是非数值，会将其转换为Number然后再比较
如果比较的两个值都是字符串，此时会比较字符串的Unicode编码，而不会转换为Number

5.5 相等运算符

==	相等，判断左右两个值是否相等
!=	不等， 判断左右两个值是否不等
===	全等，，判断左右两个值是否全等

1、这三个值在判断时，如果比较的数据类型不一致，会将其转换为相同的类型再进行比较
2、三个值判断成立的话都是返回true，反之都是false
3、由于undefined衍生自null，所以null == undefined 会返回true
4、null === undefined 会返回false
5、NaN不与任何值相等

5.6 三元运算符

语法：
条件表达式 ? 语句1:语句2;

运算流程

• 先对条件表达式求值判断
• 如果判断结果为true，则执行语句1，并返回执行结果
• 如果判断结果为false，则执行语句2，并返回执行结果

5.7 运算符的优先级

6、条件语句

6.1 if…else语句

if…else语句是一种最基本的控制语句，它让JavaScript可以有条件的执行语句

if(age >= 18){
	alert("你已经长大了");
	}else{
	alert("你还小");
	}

6.2 switch…case语句

switch…case是一种流程控制语句
适用于多条分支使用同一条语句

switch(语句){
	case 表达式1:
	语句....
	case 表达式2:
	语句....
	default:
	语句...
	}

注意：
case语句只是表示的程序运行的起点，并不是终点，所以一旦符合case的条件程序会一直运行到结束，所以我们一般会在case中添加break作为语句的结束

6.3 while语句

while也是一种最基本的循环语句

while(条件表达式){
	语句....
	}

和if一样while中的条件表达式将会被转换为布尔类型，只要该值为真，则代码块将会一直重复执行
代码块每执行一次，条件表达式将会重新计算

6.4 do…while语句

do…while最少执行一次

do{
	语句...
	}while(条件表达式);

6.5 for语句

for语句也是循环控制语句，我们也将其称为for循环

for(初始化表达式;条件表达式;更新表达式){
	语句....
	}

6.6 break和continue

break和continue语句用于在循环中精确地控制代码的执行
使用break语句会使程序立刻退出最近的循环，强制执行循环后边的语句
break和continue语句只在循环和switch语句中使用
使用continue语句会使程序跳出当次循环，继续执行下一次循环，并不会结束整个循环
continue只能在循环中使用，不能出现在其他的结构中