【前端基础】18.JavaScript基础语法

视频

一，导论

1.1 计算机基础

1编程语言

1.计算机可以帮助人类解决某些问题
2.程序员利用编程语言编写程序发出指令控制计算机来实现这些任务
3.编程语言有机器语言，汇编语言，高级语言
4.高级语言需要一个编译器转换为计算机识别
5.编程语言是主动的有很强逻辑性

编程语言与标记语言的区别
编程语言有很强的逻辑和行为能力，在编程语言中，你会看到很多if else,for,while等具有逻辑性和行为能力的指令，这是主动的。
标记语言不用于向技术按及发出指令，常用于格式化和链接。标记语言的存在是用来被读取的，他是被动的。

2.计算机基础

1.计算机的组成

2.计算机内部使用0和1来表示数据。
3.数据存储单位
bite<byte<kb<MB<GB<TB
4.程序运行
打开某个程序，先从硬盘中把程序的代码加载到内存中
CPU执行内存中的代码

注意：之所以要内存的一个重要原因，是因为cpu运行太快了，如果只从硬盘中读数据，会浪费cpu性能，所有才使用存储速度更快的内存条来保存运行时的数据。（内存时电，硬盘是机械）

1.2 JavaScript初识导读

JavaScript是世界上最流行的语言之一，是一种运行在客户端的脚本语言（Script是脚本的意思）
脚本语言：不需要编译，运行过程中由js解释器（js引擎）逐行来进行解释并执行。
现在也可以基于Node.js技术进行服务器编程。

1.javascript的作用

表单动态校验（密码强度检测）（JS参数最初的目的）
网页特效
服务端开发（Node.js）
桌面程序（Electron）
App(Cordova)
控制硬件–物联网（Ruff）
游戏开发（cocos2d-js）

2.HTML/CSS/JS的关系

HTML/CSS标记语言–秒速类语言

• HTML决定网页结构和内容（决定看到什么），相当于人的身体。
• CSS决定网页呈现给用户的模样（决定好不好看），相当于给人穿衣服，化妆。
• JS脚本语言–编程类语言
  实现业务逻辑和页面控制（决定功能），相当于人的各种动作。

3.浏览器执行JS简介

渲染器分为两部分 渲染引擎和JS引擎

• 渲染引擎：用来解析HTML与CSS，俗称内核，比如chorme浏览器的blink,老版本的webkit
• JS引擎：也称为JS解释器。用来读取网页中的JavaScript代码，对齐处理后运行，比如chrome浏览器的V8.

浏览器本身并不会执行JS代码，而是通过内置JavaScript引擎（解释器）来执行JS代码。JS引擎执行代码时逐行解释每一句源码（转换为机器语言），然后由计算机去执行，所以Javascript语言归为脚本语言，会逐行解释执行。

4.JS的组成及引入

ECMAScript
ECMAScript是由ECMA国际（原欧洲计算机制造商协会）进行标注化的一门编程语言，这种语言在万维网上应用广泛，它往往被称为JavaScript或JScript,但实际上后两种是ECMAScript语言的实现和扩展。

    <!-- 1.行内式的js直接写到元素的内部 -->
    <input type="button" value="唐伯虎" onclick="alert('秋香姐')"> 

    <!-- 2.内嵌式的js -->
    <script>
        // alert('沙漠骆驼')
    </script>

    <!-- 3.外部的js script 双标签 -->
    <script src="my.js"></script>

行内式 JS
可以将单行或少量JS代码写在HTML标签的事件属性中（以on开头的属性），如：onclick
注意单引号的使用：在HTML中我们推荐使用双引号，JS中我们推荐使用单引号
可读性差，在html中编写JS大量代码时，不方便阅读；
引号易错，引号多层嵌套匹配时，非常容易弄混；
特殊情况下使用

外部JS文件
利用HTML页面代码结构化，把大段JS代码独立到HTML页面之外，既美观，也方便文件级别的复用
利用外部JS文件的script标签中间不可以写代码
适合于JS代码量比较大的情况

5.JS注释

单行注释  //  ctrl+/
多行注释  /*123*/  shift+alt+a

6.JS输入输出语句

方法	说明	归属
alert(msg)	浏览器弹出警示框	浏览器
console.log(msg)	浏览器控制台打印输出信息	浏览器
promot(info)	浏览器弹出输入框，用户可以输入	浏览器

二，变量

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

2.1 变量的使用

1.声明变量

var age;

var是一个JS关键字，用来声明变量（variable变量的意思）。使用该关键字声明变量后，计算机会自动为其变量分配内存空间，不需要程序员管。

2.赋值

age=10;

3.变量的初始化

var age=18;

2.2变量语法扩展

1. 更新变量
   一个变量被重新赋值后，它原有的值就会被覆盖，变量值将以最后一次赋的值为准。

2. 声明多个变量
   只需要写一个var,多个变量名之间使用英文逗号隔开。

   	  var age = 18,
         address = '火影村'，
         gz = 2000;
   

3. 声明变量特殊情况

   情况	说明	结果
   var age;console.log(age)	只声明 不赋值	undefined
   console.log(age)	不声明 不赋值 直接使用	报错
   age=10;console.log(age)	不声明 只赋值	10

2.3 变量命名规范

• 由字母（大小写），数字（0-9），下划线（_），美元符号（$）组成
• 严格区分大小写。var app;和var App;是两个变量。
• 不能以数字开头。18age是错误的。
  (只能以 $ ,_, 字母 开头)
• 不能是关键字，保留字。例如：var,for,while
• 变量名必须有意义。MMD BBD nl–>age
• 遵守驼峰命名法。首字母小写，后面单词的首字母需要大写。myFirstName
• 推荐翻译网站：有道 爱词霸

三，数据类型

不同数据所需暂用的存储空间不同。JavaScript是一种弱类型或者说动态语言。这意味着不用提前声明变量的类型，在程序运行过程中，类型会被自动确定。
（根据等号右边的值来确定的）
JavaScript拥有动态类型，同时也意味着相同的变量可用作不同的类型。

3.1数据类型的两大类

简单数据类型（Number(数字型，默认0),String(默认""),Boolean(默认false),Undefined(默认undefined),Null(默认null)）
复杂数据类型（object）

1.数字型

八进制就在前加0
十六进制就在前加0x

数字型范围

//数字型的最大值
console.log(Number.MAX_VALUE);//1.797691348623157e+308
//数字型的最小值
console.log(Number.MIN_VALUE);//5e-324

数字型三个特殊值
Infinity,代表无穷大，大于任何数值
-Infinity,代表无穷小，小于任何数值
NaN,Not a number,代表一个非数值

console.log(Number.MAX_VALUE*2);//Infinity

console.log(Number.MIN_VALUE*2);//-Infinity

console.log('123'-100)//NaN

//isNaN()这个方法用来判断非数字 并且返回一个值 如果是数字返回的是false 如果不是数字返回的是true
console.log(isNaN(12))

2.字符串型

推荐单引号
如果嵌套引号，外单内双或外双内单

字符串转义符（写在引号里）

转义符	解释说明
\n	换行符
\\	斜杠\
\'	’ 单引号
\"	" 双引号
\t	tab 缩进
\b	空格

字符串长度
通过字符串的length属性获取

字符串拼接
多个字符串之间可以使用+进行拼接，其拼接方式为字符串+任何类型=拼接之后的新字符串
数值相加，字符相连
我们变量不要写到字符串里面，是通过和字符串相连的方式实现的。

3.布尔值 Boolean

布尔类型有两个值：true和false
参与加法运算分别当1和0来看待

4.undefined

注意该类型相加结果

var variable =undefined;
console.log(variable+'pink'); //undefinedpink
console.log(variable+1);//NAN

5.null

注意该类型相加结果

var variable =null;
console.log(variable+'pink'); //nullpink
console.log(variable+1);//1

3.2 typeof-检测类型

注意 typeof(null) 和 typeof(undefined) 的巨大区别

var num = 10;
console.log(typeof num);//number

var num = null;
console.log(typeof num);//object

var a = undefined;
console.log(typeof(a))//undefined

//prompt 取过来的值是 字符型的
var age = prompt('请输入您的年龄');
console.log(age);
console.log(typeof age);

控制台显示：
蓝色偏亮—数值型
黑色–字符串型
蓝色偏暗—布尔型
浅灰—undefined,null

3.3 字变量

字面量是在源代码中一个固定值的表示法，通俗来说，就是字面量表示如何表达这个值
数字字面量：8，9，10
字符串字面量：‘前端’，‘开发’
布尔字面量：true,false

3.4 数据类型转换

1.转换为字符串

方式	案例
toString()	var num=1;alert(num.toString())
String()强制转换	var num=1;alert(String(num))
加号拼接字符串,隐式转换	var num=1;alert(num+‘’)

2.转换为数字型（重点）

方式	案例
parseInt(string)函数	pareInt(‘78’)
paseFloat(string)函数	parseFloat(‘78.21’)
Number()强制转换函数	Number(‘12’)
js隐式转换(- * /)	‘12’-0

注意 Number() 和 parseInt() 的巨大区别

console.log(paseInt('120px'));//120 会去掉px单位
console.log(parseInt('rem120pxabs'));//NaN

console.log(Number('12px'));//NaN

console.log(Number('123'));

console.log('12' - 0);//12
console.log('123'-'120');//3
console.log('123'*1);//123

console.log(parseFloat(1.1))//1.1
console.log(parseFloat(1))//1
console.log(parseInt('a12345'))//NaN
console.log(Number('12345a'))//NaN

3.转换为布尔型

方式	案例
Boolean()函数	Boolean(“true”)

代表空，否定的值会被转换为false,如 ‘’,0,NaN.null,undefined ,
其余全部转换为true

3.5 翻译器的两种翻译方式

程序语言翻译成机器语言的工具，被称为翻译器。
翻译器翻译的方式有两种：一种是翻译，另外一种是解释。两种方式之间的区别在于翻译的时间点不同。
编译器是在代码执行之前进行编译，生成中间代码文件
解释器是在运行时进行及时解释，并立即执行（当编译器以解释方式运行的时候，也称为解释器）

3.6 标识符，关键字，保留字

标识符：开发人员为变量，属性，函数，参数取的名字。
标识符不能是关键字或保留字。

关键字：JS本身已经使用了的字，不能再用他们充当变量名，方法名。
包括：break,case,catch,continue,default,delete,do,else,finally,for,function,if,in,instanceof,new,return,switch,this,throw,try,typeof,var,void,while,with等。

保留字：预留的关键字。
包括：boolean,byte,char,class,const,debugger,double,enum,export,extends,final,float,goto,implements,import,int,interface,long,mative,package,private,protected,public,short,static,short,static,super,synchronized,throws,transient,volatile等。

四，运算符

运算符也被称为操作符，是用于实现赋值，比较和执行算术运算等功能的符号。

4.1算术运算符

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

4.2表达式和返回值

表达式：由数字，运算符，变量等以能求的数值（返回值）的有意义排列方法所得的组合。

4.3递增和递减运算符

++,–
在JavaScript中，递增（++）和递减（–）既可以放在变量前面，也可以放在变量后面。放在变量前面时，我们可以称为前置递增（递减）运算符，放在变量时，我们可以称为后置递增（递减）运算符。
注意：递增和递减运算符必需和变量配合使用。

var age = 10;
++age;
console.log(age);
//先加1，后返回值
var p = 10;
console.log(++p + 10);//21

前置自增和后置自增如果单独使用 效果是一样的。
前置自增：先加1，后返回值
后置自增：先返回原值，后加1

var e = 10;
var f = e++ + ++e;//e++ = 10  e = 11  2.e = 12  ++e=12
console.log(f);//22

4.4比较运算符概述

会返回一个布尔值，(true/false)座位比较运算的结果。

<,>,>=,<=,!=,==(判等号(会转型)),
===,!== (全都 要求值和数据类型都一致)

注意 undefined 和 null 之间的比较：

console.log(''== undefined)//false
console.log(''==null)//false
console.log(null==undefined)//true

console.log(0=='')//true
console.log(false=='')//true
console.log(false== 0)//true

4.5逻辑运算符

逻辑运算符是用来进行布尔值运算的运算符，其返回值也是布尔值。开发中经常用于多个条件的判断。

逻辑运算符	说明	案例
&&	“逻辑与”，简称"与"，and	true&&false
II	“逻辑或”，简称"或" or	trueIIfalse
!	“逻辑非”，简称"非"，not	!true

4.6短路运算的原理

当有多个表达式（值）时，左边的表达式值可以确定结束时，就不再继续运算右边的表达式的值。

逻辑与：
语法：表达式1&&表达式2
如果第一个表达式的值为真，则返回表达式2
如果第一个表达式的值为假，则返回表达式1

console.log(123&&456);//456
console.log(0&&456);//0
console.log(0&&1+2&&456+5678);//0
console.log(''&&1+2&&456+5678);//''

参考上面和下面代码，如果有空的或者否定的为假，其余是真的。

否定：
0 ‘’ null undefined NaN

逻辑或：
语法：表达式1||表达式2
如果第一个表达式的值为真，则返回表达式1
如果第一个表达式的值为假，则返回表达式2

console.log(123||456);//123
console.log(0||456||456+123);//456
console.log(123||456||456+5678);//123

var num=0;
console.log(123||num++);//123
console.log(num);//0

4.7赋值运算符

=，
+=，-=，
*=，/=,%=,

4.8运算符优先级

优先级	运算符	顺序
1	小括号	()
2	一元运算符	!最大,再++和- -
3	算数运算符	先* / %后+ -
4	关系运算符	>,>=,<,<=
5	相等运算符	==,!=,===,!==
6	逻辑运算符	先&&后 II
7	赋值运算符	=
8	逗号运算符	,

一元运算符里面的逻辑非优先级更高
逻辑与比逻辑或优先级高

五，流程控制分支结构

流程控制主要有三种结构，分别是顺序结构，分支结构和循环结构，则三种结构代表三种代码执行的顺序。

5.1顺序流程控制

按照代码的先后顺序，依次执行。

5.2分支流程控制if语句

由上到下执行代码的过程中，根据不同的条件，执行不同的路劲代码，从而得到不同的结果。

//if的语句结构 如果if
if (条件表达式){
	//执行语句
}

if (条件表达式){
	//[如果]条件成果执行的代码
}else{
	//[否则]执行的代码
}

5.2 if else if 语句（多分支语句）

if (条件表达式1) {
	//语句1
} else if (语句表达式2) {
	//语句2
} else if (语句表达式3) {
	//语句3
}else {
	//最后的语句
}

5.3 三元表达式

？ ：
条件表达式?表达式1:表达式2
如果条件表达式结果为真 则 返回 表达式1的值，
如果条件表达式结果为假 则 返回 表达式2的值。

var num = 10;
var result = num > 5 ? '是的' : '不是的'；
console.log(result);

5.4 分支流程控制switch语句中

switch语句也是多分支语句 也可以实现多选。
语法结构 switch 转换,开关,case效力子或者选项的意思。

switch(表达式){
	case value1:
		执行语句1;
		break;
	case value2:
		执行语句2;
		break;
	...
	default:
		执行最后的语句;
}

我们num的值和case里面的值相匹配的时候是全等，必须是值和数据类型一致才可以
注意下面代码：

		for(var j=1;j<=4;j++){	
			switch(j){
				default:
					console.log("d");
				case 1:
					console.log(j);
					break;
				case 2:
					console.log(j);
					break;
			}
		}
		//1 2 d 3 d 4

5.5 switch语句和 if else if 区别

• 一般情况下，他们两个语句可以相互替换。
• switch…case语句通常处理case比较确定值的情况，二if…else…语句更加灵活，常用于范围判断（大于,等于某个范围）
• switch语句进行条件判断后直接执行到程序的条件语句，效率更高。而if…else语句有有几种条件，就得判断多少次。
• 当分支比较少时，if…else语句的执行效率比switch语句高。
• 当分支比较多时，switch语句的执行效率比较高，而且结构更清晰。

六，循环

循环的目的：可以重复执行某些代码。

• for循环
• while循环
• do…while循环

6.1 for循环

for(初始化变量;条件表达式;操作表达式){
	//循环体
}

初始化变量 就是用var声明的一个普通变量，通常用于作为计数器使用
条件表达式 就是用来决定每一次循环是否继续执行，就是终止的条件
操作表达式 是每次循环最后执行的代码，经常用于我们计数器变量进行更新（递增或递减）

for(var i = 1; i <= 100; i++){
	console.log('你好');
}

6.2 while 循环

while (条件表达式) {
	//循环体代码
}

6.3 do while 循环

该循环会先执行依次代码块，然后对条件表达式进行判断，如果条件为真，就会重复执行循环体，否则退出循环。
该循环至少执行一次。

do{
	//循环体
}
while (条件表达式)

6.4 continue break

continue 关键字用于立即跳出本次循环，继续下一次循环。
break 关键字用于立即跳出整个循环（循环结束）。

6.5 书写规范

1.标识符命名规范

• 变量，函数的命名必须要有意义。
• 变量的名称一般用名词。
• 函数的名词一般用动词。

2.操作符规范

操作符的作用两次各保留一个空格。

      var str = '';
      for (var i = 1; i <= 9; i++) {
        for (var j = 1; j <= i; j++) {
          str += j + '*' + i + '=' + i * j + '\t'; // 注释
        }
        str += '\n';
      }
      console.log(str);

3.单行注释规范

单行注释前面主要有个空格

七，数组

数组是指一组数据的集合，其中的每个数据被称为元素，在数组中可以存放任意类型的元素。数组是一种将一组数据存放在单个变量名下的优雅方式。

7.1 数组的两种创建方式

• 利用 new 创建数组
• 利用数组字面量( [] )创建数组

      //1.利用new创建数组
      var arr = new Array();
      //2.利用数组字面量创建数组[]
      var arr = [];
      var arr1 = [1, 2, 'pink', true];
      //3.数组里面的数据一定要用逗号分隔
      //4.数组里面的数据 比如1，2 我们称为数组元素

7.2 获取数组元素

索引（下标）：用来访问数组元素的序号（数组下表从0开始）。
获取数组元素 格式 ： 数组名[索引号]
如果没有某个数组元素，输出结果是 undefined

7.3 遍历数组

      var arr1 = [1, 2, 'pink', true];
      for (var i = 0; i < 4; i++) {
        console.log(arr1[i]);
      }

7.4 数组的长度

使用“数组名.length”可以访问数组元素的数量（数组长度）
想要输出多个变量，用逗号分隔即可。

console.log(sum, average);

7.5 新增数组元素

(1) 新增数组元素 修改length长度
(2) 新增数组元素，修改索引号
(3) 不要直接给数组名赋值，否则里面的数组元素都没有了。

      //1.新增数组元素 修改length长度
      var arr = ['red', 'green', 'blue'];
      console.log(arr.length);
      arr.length = 5;
      console.log(arr);
      console.log(arr[3]); //undefined
      console.log(arr[4]); //undefined

      //2.新增数组元素，修改索引号
      var arr1 = ['red', 'green', 'blue'];
      arr1[3] = 'pink';
      console.log(arr1);
      arr1[4] = 'hotpink';
      console.log(arr1);
      arr1[0] = 'yellow'; //这是替换原来的数组元素
      console.log(arr1);
      arr1 = '123';
      console.log(arr1); //不要直接给数组名赋值，否则里面的数组元素都没有了。

7.6 冒泡排序

  // 1.一共需要的趟数，我们用外层for循环
  // 长度是arr.length-1
  // 2.每一趟交换次数，我们用里层for循环
  // 长度就是数组的长度 减去 次数
  // arr.lenth-i-1
  // 3.交换2个变量

      var arr = [5, 4, 3, 2, 1];
      for (var i = 0; i <= arr.length - 1; i++) {
        for (var j = 0; j <= arr.length - i - 1; j++) {
          if (arr[j] > arr[j + 1]) {
            var temp = arr[j];
            arr[j] = arr[j + 1];
            arr[j + 1] = temp;
          }
        }
      }
      console.log(arr);

八，函数

函数就是封装量一段可被重复调用执行的代码块。通过这些代码快可以实现大量代码的重复使用。

8.1 函数的使用

函数的使用分为两步：声明函数和调用函数。

1.声明函数

function 函数名() {
	//函数体
}

• function 是声明函数的关键字，必须小写
• 由于函数一般是为了实现某个功能才定义的，所以通常我们将函数名命名为动词，比如getSum。

function sayHi() {
	console.log('hi~~');
}

function doSome(){
	return 'doSome';
}
function　saySome(){
	console.log('saySome')
}

console.log(typeof doSome())//string
console.log(typeof saySome())//undefine

2.调用函数

函数名();

• 调用的时候千万不要忘记添加小括号
• 声明函数本身并不会执行代码，只有调用函数时才会执行函数体代码。

sayHi();

3.函数的封装

函数的封装是把一个或者多个功能通过函数的方式封装起来，对外只提供一共简单的函数接口

• 在声明函数的小括号里面是形参（形式上的参数）

• 在函数调用的小括号里面是实参（实际的参数）

• 形参是接受实参的 aru = ‘酸辣土豆丝’ 形参类似于一个变量

• 多个函数之间用逗号隔开

• 形参可以看作是不用声明的变量(可参考下方代码)

• 如果实参的个数多于形参的个数 会取到形参的个数

• 如果实参的个数小于形参的个数 多于的形参定义为undefined，最终的结果是NaN。

参数的作用：在函数内部某些值不能确定，我们可以通过函数在调用函数是传递不同的值进去。

function doSome(a,b){
	console.log(a);//undefined
	return a;
}
console.log(typeof doSome())//undefined

8.2 函数的返回值

我们函数知识实现某种功能，最总的结果需要返回给函数的调用者函数名() 通过return实现的。
只要函数遇到return 就后把面的结果 返回给函数的调用者。函数名()=return后面的结果。

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

• return 只能返回一个值。如果用逗号隔开多个值，以最后一个为准。
• return [] 返回一个数组
• 函数没有 return 返回 undefined

break,continue,return的区别
break:结束当前的循环体（如for,while）
continue:跳出本次循环，继续执行下次循环（如for,while）
return:不仅可以退出循环，还可以返回return语句中的值，同时还可以结束当前的函数体内的代码。

8.3 arguments的使用

当我们不确定有多少个参数传递的时候，可以用arguments来获取。在JavaScript中，arguments实际上是当前函数的一个内置对象。所以函数都内置了一共arguments对象，arguments对象中存储了传递的所有实参。

      //arguments 的使用
      function fn() {
        console.log(arguments);
        //里面存储了传递过来的实参
      }
      fn(1, 2, 3);

arguments展示形式是一个伪数组，因此可以进行遍历。伪数组具有以下特点：

• 具有length属性
• 按索引方式存储数据
• 不具有数组的push,pop等方法

function doSome(){
	console.log(arguments.length)//3
	console.log(arguments[1])//2
	console.log(typeof arguments)//object
}
doSome(1,2,3)//undefined

8.4 函数的两种声明方式

      // 1.利用函数关键字自定义函数（命名函数）
      function fn() {}
      fn();
      // 2.函数表达式
      // var 变量名 = function() {}
      var fun = function () {
        console.log('我是函数表达式');
      };
      fun();

（1）fun是变量名 不是函数名
（2）函数表达式声明方式跟声明变量差不多，只不过变量里面存的是值 而 函数表达式里面存的是函数。
（3）函数表达式也可以进行传递参数

九，作用域

9.1 全局变量与局部变量

通常来说，一段程序代码中用到的名字并不总是有效和可用的。而限定这个名字的可用性的代码范围就是这个名字的作用域。作用域的使用提高了程序逻辑的局部性，增加了程序的可靠性，减少了名字冲突。

• 全局作用域：整个script标签 或者是一个单独的js文件
• 局部作用域（函数作用域）在函数内部就是局部作用域 这个代码的名字只在函数内部起效果或作用。

变量的作用域：根据作用域的不同我们变量分为全局变量和局部变量
全局变量：在全局作用域下的变量 在全局下都可以使用
局部变量：在局部作用域下的变量 后者在函数内部的变量就是 局部变量

注意：如果在函数内部 没有声明直接赋值的变量也属于全局变量
注意：函数的形参也可以看做是局部变量

从执行效率来看全局变量和局部变量
（1）全局变量 只要浏览器关闭的时候才会消失，比较占内存资源。
（2）局部变量 当我们程序执行完毕就会销毁，比较节约内存资源

9.2 javaScript没有块级作用域

现阶段我们js没有块级作用域
我们js也是在es6的时候新增的块级作用域
什么是块级作用域：

if {} for {}  外界是不可以访问的
//java
//if(xx){
//	int num = 10;
//}

9.3 作用域链

只要是代码，就至少有一个作用域。
写在函数内部的局部作用域。
如果函数中还有函数，那么在这个作用域就又可以诞生一个作用域。
根据在内部函数可以访问外部函数变量的这种机制，用链条查找决定哪些数据能被内部函数访问，就称作用域链

// 作用域链：内部函数访问外部函数的变量，采用的是链式查找的方式来决定取哪一个值，这种结果我们称为作用域链
var num = 10;
function fn() {//外部函数
	var num = 20;
	function fun() {//内部函数
		console.log(num);
	}
	fun();
}
fun();//20

十，预解析

函数表达式调用 必须写在 函数表达式 的下面。
1.我们js引擎运行js分为两步：预解析 代码执行
（1）预解析js引擎会把js里面所有的var 还有function 提升到当前作用域的最前面。
（2）代码执行 按照代码书写的顺序从上往下执行
2.预解析分为 变量预解析（变量提升）和函数预解析（函数提升）
（1）变量提升 就是把所有的变量提升到当前作用域最前面 不提升赋值操作
（2）函数提升 就是把所有的函数声明提升到当前作用域最前面 不调用函数

函数内部：
var a=b=c=9;

相当于 var a=9;b=9;c=9;b和c直接赋值 没有var 声明 ，当全局变量看

十一，JavaScript 对象(object)

在JavaScript中，对象是一组无序的相关书写和方法的集合，所有的事物都是对象，例如字符串，数值，数值，函数等。
构造函数泛指某一大类，比如苹果。
对象实例特指一个事物，比如这个苹果。

• 属性：事物的特征，在对象中用属性来表示（常用名词）
• 方法：事物的行为，在对象中用方法来表示（常用动词）

11.1 创建对象的三种方式

• 利用字面量创建对象
• 利用new Object创建对象
• 利用构造函数创建对象

1. 利用字面量创建对象

对象字面量：就是花括号{}里面包含了表达这个具体事物（对象）的属性和方法。

      var obj = {
        uname: '张三',
        age: 18,
        sex: '男',
        sayHi: function () {
          console.log('Hi~');
        },
      };
      //(1)里面的属性或者方法我们采取键值对的形式 键 属性名：值 属性值
      //(2)多个属性或者方法中间用逗号隔开
      //(3)方法冒号后面跟的是一共匿名函数
      //2.使用对象
      //(1)调用对象的属性 我们采用 对象名.属性名
      console.log(obj.uname);
      //(2)调用属性还有一种方法 对象名['属性名']
      console.log(obj['age']);
      //(3)调用对象的方法 sayHi 对象名.方法名()
      obj.sayHi();

1.不同点
变量 单独声明并赋值 使用的时候直接写变量名 单独存在
属性 在对象里面的不需要声明的 使用的时候必须是 对象.属性

函数是单独声明 并且调用的 函数名（）单独存在的
方法 在对象里面 调用的时候 对象.方法

2.相同点 都是实现某种功能 做某件事

2. 利用new Object创建对象

跟我们前面学的 new Array() 原理一致

      //利用new Object创建对象
      var obj = new Object();
      obj.uname = '张三疯';
      obj.age = 18;
      obj.sex = '男';
      obj.sayHi = function () {
        console.log('Hi~');
      };
      //(1)我们是利用等号=赋值的方法 添加对象的属性和方法
      //(2)每个属性和方法之间用 分好结束
      console.log(obj.uname);
      console.log(obj['sex']);
      obj.sayHi();

3.利用构造函数创建对象

我们利用构造函数创建对象的过程我们也称为对象的实例化。
语法格式：

    function 构造函数名(){
      this.属性=值;
      this.方法=function(){}
    }
    new 构造函数名();

      function Star(uname, age, sex) {
        this.name = uname;
        this.age = age;
        this.sex = sex;
        this.sing = function (sang) {
          console.log(sang);
        };
      }
      var ldh = new Star('刘德华', 18, '男'); //返回一个对象
      console.log(ldh.name);
      console.log(ldh['sex']);
      ldh.sing('冰雨');
      var zxy = new Star('张学友', 19, '男');
      console.log(zxy.name);
      console.log(zxy['sex']);
      zxy.sing('李香兰');

1.构造函数名字首字母要大写
2.我们构造函数不需要return就可以返回结果
3.我们调用构造函数 必须使用new
4.我们只要new Star() 调用函数创建一个对象ldh{}
5.我们属性和方法前面必须添加this

11.2 new关键字执行过程

（1）new构造函数可以在内存中创建一个空的对象。
（2）this 就会指向刚才创建的空对象。
（3）执行构造函数里面的代码 给这个空对象添加属性和方法。
（4）返回这个对象。（所有构造函数里面不需要return）

11.3 遍历对象属性(for…in )

for…in 语句用于对数值或者对象的属性进行循环操作。

for (变量 in 对象) {
}

      var obj = {
        name: 'pink',
        age: 18,
        sex: '男',
        fn: function () {},
      };
      for (var k in obj) {
        console.log(k); //k变量 输出 得到的是属性名
        console.log(obj[k]); //obj[k]得到的是 属性值
      }
      //我们使用for in 里面的变量 我们喜欢写 k  或者 key