7_javaScript_基本数据类型_运算符_控制语句

JavaScript概述

• JavaScript 是世界上最流行的编程语言,可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备。
• JavaScript 是脚本语言,是一种轻量级的编程语言。可以简单的将我们以前学过的HTML元素比作演员，而脚本语言就是剧本，你就是导演！
• 之前我们通过学习的HTML+CSS可以完成静态的网页（当然也可以加一下简单的动画），通过JavaScript的学习我们可以增加网页的交互功能等完成复杂的动态网页。
• 当然JavaScript还有许多其他的用处，随着学习的深入我们逐步来介绍。
• JavaScript 与 Java 是两种完全不同的语言，无论在概念还是设计上。

嵌入JavaScript代码的三种方式

• 写在 script 标签中
• 直接放在HTML标签中
• 以外部文档的方式连接到当前HTML文档中。

注意事项：

• 字母的大小写，Name和name是两个不同的标识符。
• 空格和换行。这一点和CSS代码规则类似:多余的空格会被忽略，可以将一行代码分成多行写。
• 分号作为一个语句的结束标志，分号之后是新语句的开始。虽然省略不写通常也是没有问题的，但还是建议大家写上。
• 代码的注释：单行注释和多行注释。

document.write() 的常用操作

1. 除了直接输出文字外，它还支持带有HTML标签的输出内容。
2. 比如直接输出一个标题
3. 比如在输出内容中加入br换行标签
4. 比如直接输出列表项......

document.write('

标签标
题

---

');

alert()方法

1. alert()方法会输出一个对话框，在以后的课程中我们会经常用它进行测试，务必先了解它的用法。
2. 可以添加多个alert();他们会按照顺序依次执行。

alert('提示');

onclick事件的基本用法

1. onclick()事件是最常用的事件之一，所谓事件可以简单理解为用户的操作。

常量

1. 常量是从始至终不能被改变的数据。比如: 数字 123 可以是常量，字符串 "hello" 也是一个常量......

• 常量通常用来表示固定不变的量，比如圆周率，万有引力常量。

变量

1. 变量的值是可以改变的，变量可以看做是存储数据的容器。比如一个瓶子，它既可以装入酱油、醋；也可以装入茅台和二锅头......

• 在 JavaScript 中创建变量通常称为“声明”变量，使用关键字 var来声明变量。
• 向变量赋值，使用等号;可以在声明变量时对其赋值，也可以先声明后赋值。
• 可以在一条语句中声明很多变量。该语句以 var 开头，并使用逗号分隔变量即可

数据类型

可以使用typeof(变量名)查询数据类型

1. 数据类型包括:字符串、数字、布尔、数组、对象、Null、Undefined

• 数字 number: JavaScript 只有一种数字类型。数字可以带小数点，也可以不带：
• 字符串 string:字符串 是存储字符的变量。
• 布尔 boolen:只能有两个值：true 或 false。
• 数组 array:
• null 空值:可以通过将变量的值设置为 null 来清空变量。
• object: 对象由花括号分隔。在括号内部，对象的属性以名称和值对的形式 (name : value) 来定义。属性由逗号分隔。
• Undefined 这个值表示变量不含有值或未声明。

温馨提示：注意事项

1. 在一个HTML文档使用script标签嵌入多个JS语句的时候，这几个语句之间是相通的,或者说是有关联的。
2. 命名规范(包括函数名，变量等):
   • 必须以字母、下划线或者美元符号开始，不能使用特殊符号。
   • 命名不能是系统的关键字：比如new ,if,class......
   • 区分大小写
   • 命名最好用有意义的名称。比如说name,people......

数据类型包括:字符串、数字、布尔、数组、对象、Null、Undefined

关于数据类型的分类，不同书籍的分类方法有所不同，有的划分为复杂数据类型和简单数据类型，也有的划分为原始数据类型和复合数据类型；

有的书籍将函数作为一种特殊的数据类型，有的认为函数不算是数据类型；

typeof运算符

1. typeof运算符可以查询数据类型
2. 其返回可能值有:undefined,boolean,number,string、object以及function.

alert(typeof(n));

数据类型

1. 字符串型数据String：字符串是存储字符的变量。

   • 常量字符串：如 "JavaScript",'HTML5'
   • 变量字符串：如：var text="HTML5视频教程"
   • 可以使用"+"进行字符串的连接。
   • 在 JavaScript 中，字符串使用单引号或者双引号来起始或者结束。那么如何输出单引号或者双引号呢？就要用到转义字符
     • JavaScript中常用的转义字符
     • 换行符：\n
     • 回车符：\r
     • 退格符: \b
     • 反斜杠: \
     • 双引号: "......document.write(n+'\n'+'s')

   温馨提示：部分转义字符在输出为HTML文档流时不发生作用。

2. 数值型数据Number：

   • JavaScript 只有一种数字类型。数字可以带小数点，也可以不带。
   • 浮点数值的最高精度是17位小数，但是在进行算术计算时其精度远远不如整数。例如，0.1加0.2的结果不是0.3， 而是0.30000000000000004。这个舍入误差会导致无法测试特定的浮点数值。
   • 极大或极小的数字可以通过科学（指数）计数法来书写：3e4 en为*10的n次方
   • 数值可以通过运算符进行计算
   • 数字可以写成十进制、八进制、十六进制。
     • 八进制在js中表示是第一位一定要是0，后面就是八进制字数序列（0~7）
     • 十六进制字面量前两位必须是0x,后面跟十六进制数字（0_9及AF）。字母A~F不区分大小写。
   • 温馨提示：科学（指数）计数法、八进制、十六进制表示的数字在输出时统统会转换成十进制。

3. 布尔型数据Boolen:

   • 布尔型数据boolen:只能有两个值：true 或 false。
   • 将各种类型的值转化成Boolean类型的规则如下：
     • Number:任意非0的数值为true,0值和NaN为"false"。
     • String:所有的非空字符串转化为 true;""（空字符串）转化成false
     • Object的任何对象都会转化为 true;
     • 在javascript中，只要逻辑表达式不返回undefined不返回null，就都是真的。

4. Undefined

   • 这是一个很有意思的数据类型，因为它的值只有一个，那就是undefined。
   • 在申明变量时如果没有将变量赋值的话这个变量也是属于Undefined类型的。。
   • 如果一个变量没有申明就直接去访问解释器会报错误信息，但是这样的变量如果使用typeof返回的结果也是"undefined"。。

5. Null:空值

   • Null也是一个只有一个值得数据类型，它的值就是null，任何变量只要给其赋值为null的话这个变量的数据类型就是Null类型。
   • 可以通过将变量的值设置为 null 来清空变量。

6. 对象Object:

   • 在javascript中，所有的对象都继承自Object对象。

7. 数组Array:

   • 可以通过"."来访问数组的元素。
   • 数组元素的顺序从0开始

   var array1=['a','b','c'];
   var array2=new Array('a','b','c');
   var array3=new Array();
           array3[0]='a';
           array3[1]='b';
           array3[2]='c';
   

8. 对象Object:

   • 在javascript中，所有的对象都继承自Object对象。
   • 对象由花括号分隔。在括号内部，对象的属性以名称和值对的形式 (name : value) 来定义。
   • 对象没有赋值的属性，该属性的值为undefined。

   var person={name:'木木'};
   alert(person.name);
   

运算符

1. 基本概念

   • 表达式：由常量/变量和运算符组成的短语；
   • 操作数：表达式中的常量和变量成为操作数；
   • 运算符：表达式中起运算作用的符合成为运算符；
   • 单目运算符：只能带一个操作数的成为单目运算符；(也叫一元运算符)
   • 多目运算符：带多个操作数的成为多目运算符；

2. 用于字符串的 + 运算符

   • +运算符用于把文本值或字符串变量加起来（连接起来）。
   • 要想在两个字符串之间增加空格，需要把空格插入一个字符串之中：
   • 如果把数字与字符串相加，结果将成为字符串。

3. 赋值运算符：赋值运算符用于给 JavaScript 变量赋值。

   • =: x=y
   • += x+=y 等价于 x=x+y
   • -= x-=y 等价于 x=x-y
   • = x=y 等价于 x=x*y
   • /= x/=y 等价于 x=x/y
   • %= x%=y 等价于 x=x%y

4. 算术运算符

   • 加减乘除：+ - * /
   • 取模运算符：%
   • 正负运算符：+ -
   • 递增递减运算符：++ --:使数字递增/递减1(注意前置和后置的区别)
     • 若没有赋值前置和后置，同。
     • 若有赋值:前置则先计算递增/减后赋值，后置则相反。

5. 比较运算符比较运算符是比较两个数的大小的运算符，返回的是一个布尔值。

   • 相等运算符 == ：判断两个操作数是否相等。不同的数据类型会自动转换为相等的数据类型再做比较。
   • 等同运算符=== ：全等（值和类型），严格意义的相等，两个操作数的值和他们的类型必须完全一致。
   • 不等于：!=
   • 不等同运算符： !==
   • 大于：>
   • 小于：<
   • 大于或等于：>=
   • 小于或等于：<=
   • 若一个是数值字符串，一个是数值，字符串会自动转换成数值进行比较。
   • 若两个都是字符串，则比较首个数字的大小。
   • 字母字符串会转换成对应的ASCII码
   • 布尔值的false和true会转换成0和1

6. 逻辑运算符

   • 逻辑运算符用于测定变量或值之间的逻辑。
   • && and(与)
   • || or(或)
   • ! not(非)

7. 条件运算符

   • 根据条件在两个语句中执行其中的一个，使用符号 ？：语法如下：
     条件表达式？语句1：语句2
   • 参数说明：
     • 条件表达式，结果会被作为布尔值处理
     • 语句1：如果条件表达式返回true则执行
     • 语句2：如果条件表达式返回false则执行

8. 运算符优先级

   运算符优先级描述了在计算表达式时执行运算的顺序。先执行具有较高优先级的运算，然后执行较低优先级的运算。例如，先执行相乘，再执行相加。

   • 运算符比较多，可以合理使用()来改变表达式的优先级。
   • ()的用法和数学中的()用法相同,()内的会优先计算。

控制语句

1. if选择语句
   条件语句用于基于不同的条件来执行不同的动作。

   • if() 语句 - 只有当指定条件为 true 时，使用该语句来执行代码
   • if()...else 语句 - 当条件为 true 时执行代码，当条件为 false 时执行其他代码
   • if()...else if()....else 语句 - 使用该语句来选择多个代码块之一来执行
   • if语句()中的表达式会自动转换成布尔值。

2. switch多条件选择语句
   使用 switch 语句来选择要执行的多个代码块之一。

   • 工作原理：首先设置表达式 n（通常是一个变量）。
   • 随后表达式的值会与结构中的每个 case 的值做比较。
   • 如果存在匹配，则与该 case 关联的代码块会被执行。
   • 请使用 break 来阻止代码自动地向下一个 case 运行。
   • default 关键词来规定匹配不存在时做的事情;相当于if里的else

   switch (expression) {
           case expression:
               xxx
               break;
           default:    
       }
   

3. for 循环语句

   • 语句 1 在循环（代码块）开始前执行
   • 语句 2 定义运行循环（代码块）的条件,如果语句 2 返回 true，则循环再次开始，如果返回 false，则循环将结束。
   • 语句 3 在循环（代码块）已被执行之后执行
   • 语句 1 是可选的，也就是说不使用语句 1 也可以。
   • 如果您省略了语句 2，那么必须在循环内提供 break。否则循环就无法停下来。这样有可能令浏览器崩溃。
   • 语句 3 也是可选的。

   for (语句 1; 语句 2; 语句 3)
   

{
被执行的代码块
}
```

4. while循环
   while循环在执行前测试一个条件，如果条件成立进入循环。

   while 循环的语法：
   while (条表达式)
   {
   语句组
   }
   

5. do-while循环
   while循环在执行前测试一个条件，而do-while循环先执行循环，然后再测试条件成立与否。

   while 循环的语法：
   do
   {
   语句组
   }
   while (条表达式)
   

6.  break和continue跳转语句
    * break将直接跳出并结束当前循环结构。
    * continue用于跳过循环中的一个迭代。
    * continue 语句只能用在循环中；break只能用在循环或 switch 中。

7.  其他控制语句
    for/in - 循环遍历对象的属性，with、return语