编程练习生的第30天 《JS基础》

< !–
JS的使用方式
1、行内JS
写在标签中的js代码
2、内部JS
写在页面中的JS代码
< script type=“text/javascript”>
// js代码写在双标签之间
</ script>
可以放在html页面中的任意位置
一般常用的几个位置：
1、< head></ head>标签中
2、< body></ body>标签中
3、写body标签后
3、外部JS
引入外部的js文件

注：
1、如果< script>< /script>标签设置了src属性，则在双标签中写的js代码无效
2、通常使用JS时，会选择内部JS或外部JS

<!--行内JS-->
<script type="text/javascript">
   // 弹出框
   // alert("这是行内JS");
   // 打印
   console.log("这是行内JS...");
</script>

语句：
JS代码是以行为单位，一行一行执行。
一般情况下，一行一条语句。
每句语句后面最好加上分号，如果一行写多条语句（不建议），则每条语句后面必须加分号。
如果是表达式，不需要加分号，如果加了JavaScript引擎会把它当做语句编译。

<script type="text/javascript">
   // 定义变量
   var a = 1;
   var str = "Hello";
   
   
</script>

变量的声明
JavaScript 是一种弱类型语言，在声明变量时不需要指明数据类型，直接用 var 修饰符进行声明。
两种方式：
1、先声明，后赋值
2、声明并赋值

/*变量的声明*/
// 1、先声明，后赋值
var a;
a = 1;
// 2、声明并赋值
var b = 2;

/*变量的注意点*/
// 1）若只声明而没有赋值，则该变量的值为 undefined。
var c;
console.log(c); // undefined

// 2）变量要有定义才能使用，若变量未声明就使用，JavaScript 会报错，告诉你变量未定义
// console.log(d); // Uncaught ReferenceError: d is not defined

// 3）可以在同一条 var 命令中声明多个变量。

var aa=1,bb=2,cc = 10;
console.log("aa:" + aa);
console.log("bb:" + bb);
console.log("cc:" + cc);

// 4）若使用 var 重新声明一个已经存在的变量，是无效的。

var aa;
console.log(aa);

// 5）若使用 var 重新声明一个已经存在的变量且赋值，则会覆盖掉前面的值

var bb = 22;
console.log(bb);

// 6）JavaScript 是一种动态类型、弱类型语言，也就是说，变量的类型没有限制，可以赋予各种类型的值。

var str = "Hello JS!";
var flag = true;
var num = 1.5;
console.log(str);
console.log(flag);
console.log(num);

// 7）声明变量时，可以不加var修饰符，此时变量为全局变量（不建议）

e = 10;
console.log(e);

// 定义函数（方法）
function test() {
   var qq = 10; // 局部变量
   ww = 20; // 全局变量
}

// 调用方法
test();

JS是弱类型语言，变量没有类型，但数据有类型。
JavaScript 中有 6 种数据类型。
其中有五种简单的数据类型：
Undefined、Null、布尔、数值和字符串。
一种复杂数据类型 Object。
数 值（Number）： 整数和小数（比如 1 和 3.14）
字符串（String）： 字符组成的文本（比如"Hello World"）
布尔值（Boolean）：true（真）和 false（假）两个特定值
Undefined： 表示“未定义”或不存在，即此处目前没有任何值
Null： 表示空缺，即此处应该有一个值，但目前为空
对象（object）(引用) ： 各种值组成的集合
对象（object）(引用) ： 各种值组成的集合
1)、对象（object）{name:“zhangsan”,age:“18”}
2)、数组（array）[1,2,3]
3)、函数（function）function test() {}

JS中数组的创建
数组的创建
var arr=[值 1,值 2,值 3]; //隐式创建
var arr=new Array(值 1,值 2,值 3); //直接实例化
var array=new Array(size); //创建数组并指定长度
数组的遍历
1、for(var i=0; i < 数组.length; i++) {}
2、for(var 下标名 in 数组) {}
3、数组.forEach(function(元素，下标){});

<script type="text/javascript">
   /*数组的创建*/
   var arr1 = [1,2,3];
   var arr2 = new Array(4,5,6);
   var arr3 = new Array(5);
   

数组的遍历

/* 1、for(var i=0; i < 数组.length; i++) {} */
for(var i = 0; i < arr1.length; i++) {
   console.log(arr1[i]);
}

/* 2、for(var 下标名  in 数组) {} */
for(var index in arr1) {
   console.log(arr1[index]);
}

/* 3、数组.forEach(function(元素，下标){}) */
arr1.forEach(function(element,index){
   console.log(element);
   console.log(index);
   console.log("----");
});

数组中常用的方法

push 添加元素到最后
unshift 添加元素到最前
pop 删除最后一项
shift 删除第一项
reverse 数组翻转
join 数组转成字符串
indexOf 数组元素索引
slice 截取（切片）数组，原数组不发生变化
splice 剪接数组，原数组变化，可以实现前后删除效果
concat 数组合并

JS中的函数

1. 函数的定义
   有三种函数定义的方式：函数声明语句、函数定义表达式、Function 构造函数
   函数声明语句
   function 函数名([参数列表]) {}
   调用：函数名([参数列表]);
   函数定义表达式
   var 变量名/函数名 = function([参数列表]) {}
   调用：变量名/函数名([参数列表]);
   Function 构造函数
   var 变量名 = new Function(“参数1”,“参数2”,“最后一个参数为是函数体”);
   调用：变量名/函数名([参数列表]);
   注意：
   1、js 中的函数没有重载，同名的函数，会被后面的函数覆盖。
   2、js 中允许有不定数目的参数
   函数的调用
   常用调用方式：函数名([实参]);
   存在返回值可以变量接收，若接收无返回值函数则为 undefined
   return 语句
   作用：在没有返回值的方法中，用来结束方法。
   有返回值的方法中，一个是用来结束方法，一个是将值带给调用者。

闭包

闭包就是能够读取其他函数内部变量的函数。

由于在 Javascript 语言中，只有函数内部的子函数才能读取局部变量，因此可以把闭包简单理解成“定义在一个函数内部的函数”。

它的最大用处有两个：
一个是前面提到的可以读取函数内部的变量
另一个就是让这些变量的值始终保持在内存中。
以及还可以避免变量名冲突的问题。

  闭包的构成：
     1、外部函数嵌套内部函数
     2、内部函数使用外部函数的环境
     3、外部函数返回内部函数

// 1、外部函数嵌套内部函数// 2、内部函数使用外部函数的环境// 3、外部函数返回内部函数// 先调用外部函数，得到内部函数