Javascript复习第十天

133 阅读4分钟

这是我参与更文挑战的第14天,活动详情查看:更文挑战

数组

数组:表示有序数据的集合,每一项之间有顺序

数组使用字面量:[],每一项之间用逗号隔开,每一项可以是任何数据类型,一般我们习惯书写相同的数据。

最后一项不书写逗号。

图片21.png

数组的数据类型:object(引用数据)

读取:数组名[index] 通过index索引值读取数组中每一项的值。index从0开始。

console.log(arr1[0]);

设置:使用=赋值

arr1[0] = 100;

length属性

数组length属性:表示数组中保存数据的总个数

对象.方法()

对象.属性

读取:数组.length

arr1.length

数组最后一项索引值arr.length - 1

arr1[arr1.length - 1]

可以通过索引值赋值强制将数组拉长

// 通过索引值赋值将数组拉长
arr1[10] = 10;
console.log(arr1.length);
// 没有赋值undefined
console.log(arr1[9]);

图片22.png

可以通过length强制将数组拉长,没有赋值仍然是undefined

// 可以通过length将数组拉长
arr1.length = 20;
console.log(arr1.length);
// 没有赋值仍然是undefined
console.log(arr1[18]);

图片23.png

数组遍历

依次数组数组中每一项数值

// 每一项可以是不同的数据类型
var arr = [10,Infinity,"你好",true,function(){console.log(1);}];
// 依次输出数组中每一项的值,索引值有效范围0   -      arr.length-1;
for(var i = 0; i <= arr.length - 1; i ++) {
	console.log(arr[i]);
}

数组的方法

首尾操作的方法

push():表示在数组结尾添加数据

参数:要添加的数据,如果是多项用逗号隔开

返回值:新数组的长度

var arr = [1,2,3,4,5,6];
// push() 在数组结尾添加
// 参数:要添加的数据,可以是散值。或者是字面量,变量名
// 返回值新数组长度
console.log(arr.push(77,[90,100]));
// push()原数组方法改变
console.log(arr);

pop():表示删除数组最后一项

参数:不用书写

返回值:删除项的值

unshift():在数组开头进行添加

参数:要添加的数据

返回值:新数组的长度

shift(): 删除数组第一项

参数:不用书写

返回值:删除的值

合并和拆分方法

合并:concat()

参数:要合并的数组

返回值:合并后的新数组

var arr1 = [1,2,3,4,5,6];
var arr2 = [7,8,9];
// concat() 
// 返回值:合并后的新数组
console.log(arr1.concat(arr2));
// 原数组不改变
console.log(arr1);

图片24.png

拆分:slice(start,end)

参数:需要两个参数

start:表示数组截取项开始的索引值

end:表示数组截取项结束的索引值

包括start不包括end

返回值: 截取后的新数组

console.log(arr1.slice(2,5));
// 原数组不改变
console.log(arr1);

图片25.png

还可以使用负数,表示倒数,从-1开始

数组方法

数组删除,插入,替换方法

splice(index,howmany,elements……)

index:必须书写,删除项开始索引值。

howmany:必须书写,删除数组项个数,如果没有删除书写0

elements:元素可以省略,可以有多个用逗号隔开。插入,替换的元素

返回值:删除项组成的新数组,没有删除返回空数组。

删除:howmany不能是0,elements不要书写

// 数组
var arr = [1,2,3,4,5,6,7];
// 删除
var arrNew = arr.splice(2, 3);
// 原数组改变
console.log(arr);
// 返回值
console.log(arrNew);

图片27.png

插入: howmany:书写为0,elements书写要插入的数据

// 插入 [1,2,3,333,444,4,5,6,7]
console.log(arr.splice(3,0,333,444));
console.log(arr);

图片28.png

替换:howmany不能是0,elements表示替换的数据

// 替换[1,2,333,444,555,5,6,7]
console.log(arr.splice(2,2,333,444,555));
console.log(arr);

图片29.png

倒序和排序

倒序:reverse(),只是将数组第一项和最一项每一项都进行前后的倒置

参数:省略

返回值:倒置后的新数组

// 数组
var arr = [1,2,3,4,5,6,7];
// 倒序
console.log(arr.reverse());
// 原数组改变
console.log(arr);

图片30.png

排序:sort()

参数:省略

返回值:排序后的新数组

排序依据:将数组每一项转为字符串,然后按照字符编码进行比较,编码越靠后越大。(从小到大) 数字 大写字母 小写字母

// 数组
var arr1 = [123,37,"a", "B",true];
console.log(arr1.sort());
// 原数组改变
console.log(arr1);

图片31.png

参数:可以书写比较函数,比较函数是一个匿名函数,可以声明两个参数,a,b

a,b表示两个要比较的数据

可以自定义升序(降序):

以升序为例: a > b: 返回负数

a == b : 返回0

a < b: 返回正数

// 自定义升序
arr2.sort(function(a,b) {
	if(a > b) {
		return 2;
	}else if(a == b) {
		return 0;
	}else if(a < b) {
		return -1;
	}
});

join()

表示将数组转为字符串方法

参数:可以不书写,也可以书写,表示每一项按照参数连接

返回值:字符串

var arr = [1,2,3,4,5,6,7];
// 省略参数,表示以逗号连接
// 返回值新字符串
// 原数组不改变
console.log(arr.join());
console.log(typeof arr.join());
console.log(arr);

// 书写参数:表示参数连接
console.log(arr.join("+"));

图片32.png

字符串length

字符串也有Length属性,表示字符个数,字符包括字母,数字,标点,空格,汉字等

var str = "今天是9月,气温偏 低!";
console.log(str.length);   //12

字符串方法

charAt

可以的到指定位置字符

参数:索引值(index从0开始)

返回值:字符

for(var i = 0 ; i < str.length ; i ++) {
	// i表示索引值
	console.log(str.charAt(i));
}

图片34.png

indexOf()

得到的是指定字符所在的索引值。没有改字符返回值-1

参数:字符

返回值:索引值

// indexOf()返回指定字符位置
console.log(str.indexOf("9月"));
// 没有该字符返回-1
console.log(str.indexOf("8月"));

图片35.png

concat()

用于字符串合并

参数:要合并的字符串

返回值:合并后的新字符串

str2.concat(str1)

slice()

用于字符串截取

参数:第一个参数start,截取项索引值,第二个参数end,截取项结束的索引值,包括start不包括end

返回值:截取到的字符串

// slice(start,end)字符串截取
var str3 = "012345678";
// 包括开始不包括结束索引值
console.log(str3.slice(3,6));
// 还可以使用负数从小写到大
console.log(str3.slice(-6,-3));
// 还可以省略end表示截取到最后
console.log(str3.slice(-6));

substr()

用于字符串截取

参数:第一个参数:index,开始项索引值; 第二个参数howmany: 截取个数

返回值:截取到的字符串

// substr(index,howmany)
var str4 = "01234567";
console.log(str4.substr(3,3));
// howmany可以省略表示截取到最后
console.log(str4.substr(3));

substring()

用于字符串截取

参数:第一个参数:start,开始项索引值; 第二个参数end: 截取项的结束索引值

返回值:截取到的字符串

和slice区别:start和end可以任何书写,表示从小索引值截取到大索引值不包括大索引值

// substring(),索引值可以不区分大小
var str5 = "01234567";
console.log(str5.substring(3,6));
// 不包括大索引值
console.log(str5.substring(6,3));

split()

将字符串转为数组

参数:要切割的字符串

返回值:切割后字符串组成的数组

var str = "abcxayuxac";
console.log(str.split("x"));

图片36.png

toUpperCase()

将字符串转为大写字母

参数:省略

返回值:转换后的新字符串

str.toUpperCase()

toLowerCase()

转为小写字母

参数:省略

返回值:转换后的字符串

tr2.toLowerCase()

案例:将“everything is good in its season”,转为每个单词的首字母大写。 即“Everything Is Good In Its Season”

/*
将“everything is good in its season”,转为每个单词的首字母大写。
即“Everything Is Good In Its Season”

1先得到每一个单词 everything good数组
2数组每一项可以使用=赋值 everything = E + verything
3将数组转为字符串
*/

// 将字符串转为数组split()
var str = "everything is good in its season";
var arr = str.split("");
// 数组每一项重新赋值
for(var i = 0 ; i < arr.length ; i ++) {
	// 索引值everything = E + verything
	arr[i] = arr[i].charAt(0).toUpperCase() + arr[i].slice(1); 
}
// 将数组转为字符串
str = arr.join("");
console.log(str);