本文详细介绍了JavaScript中的函数和数组。函数包括声明式和表达式函数，形参和返回值的概念；变量作用域分为全局和局部，以及特殊情况。数组部分讲解了定义、初始化、访问及遍历方式，还涉及二维数组的创建和操作。此外，还介绍了数组的一些常见函数，如concat、join、push等。
文章目录
1.函数
函数是代码封装和代码复用的体现。使用function来定义，调用方式函数名();
1.1.声明式函数
function 函数名( ){
//功能代码 (函数体)
}
<script type="text/javascript">
function printLove(){
document.write("Love")
}
printLove();
</script>
1.2.表达式函数
let 变量 = function(){//匿名函数
//功能代码(函数体)
};
<script type="text/javascript">
let printLove = function(){
document.write("Love...")
}
printLove();
</script>
声明式函数可以在定义前后调用，而表达式函数必须在声明后调用
1.3.函数形参
调用函数时可以把函数中需要的数据传入到函数中，那么就需要使用参数，调用方式：函数名( 实参1, 实参2, ...实参n )
function 函数名字( 形参1, 形参2，...形参n ){
功能代码…
}
let 变量 = function 函数名字( 形参1, 形参2，...形参n ){
功能代码…
}
<script type="text/javascript">
let printLove = function(boyName,girlName){
document.write(boyName+" Love... "+girlName)
}
printLove("zs","ls");
</script>
- 形参是一个变量，相当于在函数内部定义的局部变量
- 形参也是一个占位符，定义时占一个位置，调用时传入具体值
- 实参的顺序和形参的顺序一一对应
- 实参的类型和形参的数据类型一一对应
1.4.函数的返回值
希望函数执行后的结果再参与到其他的运算或者再次被其他的程序调用，使用关键字return来返回函数的执行结果
function 函数名(形参1,形参2){
//功能代码.
return 功能代码运算结果;
}
let 变量 = function (形参1,形参2){
//功能代码.
return 功能代码运算结果;
}
<script type="text/javascript">
let compare = function(a,b){
if(a>=b){
return a;
}
else {
return b;
}
}
let result = compare(10,12);//定义变量result接收函数调用后的结果
console.log(result);
</script>
- 函数第一次遇到return就结束执行，不管return后面还有多少代码都不执行
- 如果函数没有指明return，函数默认的返回值为undefined，否则以return返回值为准
2.变量作用域
变量作用域指的是一个变量在哪个范围内可以使用，为了可以在不同的范围内(函数外和函数内)使用相同的变量名字，引用不同的值
- 全局变量
函数外定义的变量，整个程序中都可以使用
- 局部变量
在某个特定的函数中定义的变量，称之为局部变量，只能够在函数内部使用
- 特殊形式
在函数内定义但是没有加var，也被作为全局变量使用
3.数组
数组：是一组数据有序排列的集合。
数组元素：数组中每一个数据
索引：数组元素对应的编号，索引从0开始,依次递增
数组的长度：数组元素的个数 数组名称.length
数组元素的访问：数组名称[ 索引 ]
数组长度＝数组最后一个元素索引+１
数组最后一个元素的索引 = 数组长度 - 1
3.1.数组的定义
- new关键字实例化数组
let arr = new Array();
- 字面量实例化数组
let arr = [];
3.2.数组初始化
- 声明数组时直接添加元素
let arr = new Array(11,22,33,44);
let arr = ["Number","String","Boolean","Undefined","Null","Symbol"];
- 通过数组索引添加元素
let arr = []; // let arr = new Array()
arr[0] = "邓超"; //添加数组元素
arr[1] = "陈赫";
arr[2] = "李晨";
3.3.访问数组
访问数组：数组名称
访问数组元素： 数组名称[ 索引 ]
访问数组的长度：数组变量名.length
- 访问的索引不存在值，默认用undefined占位
- new字符定义数组： 如果数组元素是一个数字,这个数字代表 数组长度,new Array(5) //5代表数组长度
- 数组元素最后一个元素后面不加逗号
- 数组元素： 可以是任意类型的值(基本 引用)
3.4.数组的遍历
遍历： 依次 或 挨个 取出某个范围内的所有数据
数组遍历： 依次 或 挨个 取出数组中所有的元素
- for循环遍历
for( let i= 0; i < 数组名称.length; i++ ){
var 元素变量 = 数组变量[ i ]; //代表数组中每个元素
}
<script type="text/javascript">
let arr = ["Number","String","Boolean","Undefined","Null","Symbol"];
for(let i = 0; i < arr.length; i++){
let ele = arr[i];
console.log(ele);
}
</script>
- forEach循环遍历
数组名称.forEach(function(value,index){
value : 数组元素
index : 索引
})
<script type="text/javascript">
let arr = ["Number","String","Boolean","Undefined","Null","Symbol"];
arr.forEach(function(element,index){
console.log(element+"---"+index)
})
</script>
4.二维数组
二维数组： 数组A作为数组B的元素, B就是二维数组( 数组嵌套 )
4.1.初始化二维数组
let arr = new Array(
new Array(1,2,3),
new Array("a","b","c"),
new Array("张三","李四","王五")
)
let arr = [
[],
[],
[]
]
let arr1 = [1,2,3]
ler arr2 = ["a","b","c"]
let arr3 = ["张三","李四","王五"]
let arr = [arr1, arr2, arr3]
4.2.访问二维数组中的元素
arr[x] : 访问数组arr中索引为x的元素 == 这个元素又是一个数组subArr
arr[x][y] : 访问数组subArr中索引为 y的元素
4.3.二维数组的遍历
<script type="text/javascript">
var arr = [
[80, 92, 97],
[61, 65, 71],
[59, 63, 70],
[85, 87, 99],
[76, 77, 85]
];
for(let i=0; i<arr.length; i++){
console.log(" OuterIndex: "+i);
for(let j=0; j<arr[i].length; j++){
console.log(" InnerElement: "+arr[i][j]+" InnerIndex: "+j)
}
}
</script>
<script type="text/javascript">
var arr = [
[80, 92, 97],
[61, 65, 71],
[59, 63, 70],
[85, 87, 99],
[76, 77, 85]
];
arr.forEach(function(element,index){
console.log(" OuterIndex: "+index)
element.forEach(function(element,index){
console.log(" InnerElement: "+element+" InnerIndex: "+index)
})
})
</script>
4.4.数组常用函数
- arr.concat() 连接两个或多个数组
<script type="text/javascript">
let arr = [];
let arr1 = [1,2,3];
let arr2 = [4,5,6];
console.log(arr.concat(arr1,arr2)) //1,2,3,4,5,6
</script>
- arr.join() 按指定分隔符将数组分割成字符串
<script type="text/javascript">
let arr1 = [1,2,3];
console.log(arr1.join("--")) //1--2--3
</script>
- arr.push() 在数组末尾添加元素
<script type="text/javascript">
let arr1 = [1,2,3];
arr1.push(4,5,6);
console.log(arr1);//1,2,3,4,5,6
</script>
- arr.unshift() 在数组之前添加元素
<script type="text/javascript">
let arr1 = [1,2,3];
arr1.unshift(4,5,6);
console.log(arr1);//4,5,6,1,2,3
</script>
- arr.pop() 删除数组最后一个元素
<script type="text/javascript">
let arr1 = [1,2,3];
arr1.pop();
console.log(arr1);//1,2
</script>
- arr.shift() 删除数组第一个元素
<script type="text/javascript">
let arr1 = [1,2,3];
arr1.shift();
console.log(arr1);//2,3
</script>
- arr.reverse() 翻转数组中的元素
<script type="text/javascript">
let arr1 = [1,2,3];
arr1.reverse();
console.log(arr1);//3,2,1
</script>
- arr.slice() 截取子数组
<script type="text/javascript">
let arr1 = [1,2,3,4,5,6];
let arr2 = arr1.slice(1,4);//从索引为1取到索引为4但不包含4，遵循左闭右开，即[1,4)
console.log(arr2);//2,3,4
</script>
- arr.splice() 从给定位置删除给定数量的元素
<script type="text/javascript">
let arr1 = [1,2,3,4,5,6];
let arr2 = arr1.splice(1,2);//第一个参数表示索引起始位置，第二个参数表示删除元素个数
console.log(arr2);//2,3 被删除的元素
console.log(arr1);//1,4,5,6 删除后原数组的元素
</script>
-
arr.sort() 对数组元素进行排序，默认按照字母顺序排序，准确说就是按照字符编码进行排序
如果要按照其他标准排序，必须传入参数，参数还是一个函数sortNum，两个参数a,b
返回值如下：
若 a 小于 b，排序后 a 应该在 b 之前，则返回一个小于 0 的值。
若 a 等于 b，则返回 0。
若 a 大于 b，则返回一个大于 0 的值。
<script type="text/javascript">
let arr1 = [3,5,2,6,0,7];
arr1.sort();
console.log(arr1);//0,2,3,5,6,7
</script>
<script type="text/javascript">
function sortRule(a,b){
return b-a;
}
let arr1 = [3,5,2,6,0,7];
arr1.sort(sortRule);
console.log(arr1);//7,6,5,3,2,0
</script>
扫一扫
256
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
