JS学习笔记——基础知识总结（数组）
JS基础知识总结3（数组）
- 前言
- 一、数组（array）概念
- 二、常用数组方法
- 1、创建一个数组
- 2、改变一个数组的值
- 3、反转一个数组的值
- 4、对数组排序
- 5、拼接多个数组
- 6、链接数组每一个值
- 7、具有一定兼容问题的方法
- （一）ES5数组常用方法
- 三、数组的遍历
- 四、数组排序
- 1、冒泡排序
- 2、选择排序
- 五、练习题
- 学习笔记链接
- 1、Javascript由来及书写方式
- 2、数据类型与简单运算
- 3、选择语句if、switch及练习题
- 4、循环语句while、dowhile、for及练习题
- 5、函数、预解析、作用域
- 6、数组、冒泡排序、选择排序【本篇】
前言
鉴于本人还处于学习阶段，以下内容为个人理解所做笔记，可能存在一定错误，如果能指出错误之处感激不尽，希望能与大家共同进步。
一、数组（array）概念
数组就是数据的集合，类似对象，只不过里面存储的是数据而不是变量名
1）长度：表示数组内有多少个数据，使用【变量名.length】可以查看数组长度。查看长度：consoel.log(arr.length)
2）索引（下标）：表示数据在数组内处于第几个位置
（所有语言中索引计数都是从0开始，即第一个索引为0，最后一个索引为 arr.length - 1）
arr[0]：表示arr这个数组第一位的数据
arr[n]：表示arr这个数组第n位的数据
arr[arr.length - 1]表示arr这个数组最后一位数据
二、常用数组方法
1、创建一个数组
1）直接使用字面量 [ ]：这就代表着一个空数组
var arr_1 = [ ] arr_1 为空数组
var arr_2 = [1,2,“三”，true ] arr_2为有数据的数组
2）使用内置构造函数 new Array();
var arr_3 = new Array(); arr_3为空数组
var arr_4 = new Array(10); arr_4为10位数组
var arr_5 = new Array(1,2,3,4) arr_5为有数据数组
2、改变一个数组的值
如果是按照基础数据类型那种更改数值的方法直接赋值，那会开辟一个新的地址来存储新的数据，而不是在原地址中修改数据
1）变量.push(4)：在最末尾添加一个元素4
返回值为新数组长度
2）变量.pop()：删除最末尾的一个元素
返回值为被删除的元素
3）变量.unshift(0)：在最前面添加一个元素0
返回值为新数组长度
4）变量.shift()：删除最前面的一个元素
返回值为被删除的元素
5）变量.splice(开始的索引位置，截取多少个（为0则可以添加元素），替换的元素（不写则删除原元素）)：按照索引截取数组中的某些内容
返回值是被删除的元素的集合
3、反转一个数组的值
变量.reverse
4、对数组排序
变量.sort（）：对数组内部数据进行排序，排序方法可以自己制定
参数需要一个描述排序规则的函数和一个比较两个数值的函数
规则函数
比较函数：返回值表明比较的两个数a,b之间的大小顺序
以从小到大为例：
a a== b 返回0
a>b 返回正数
以上可以简化为return a-b，从大到小为return b-a即
//从小到大排序
arr.sort(function(a,b)){
return a-b
}
//从大到小排序
arr.sort(function(a,b)){
return b-a
}
5、拼接多个数组
变量.concat（arr2或[数据，数据，数据]）：不改变原数组，而是返回拼接好的新数组
6、链接数组每一个值
变量.join（’‘链接符’‘）：不改变原数组，返回值为链接好的字符串，默认链接符为，可以自定义
7、具有一定兼容问题的方法
之前介绍的几个方法都是较早推出的ES3方法兼容性较好，接下来介绍的几个方法需要考虑到兼容问题
（一）ES5数组常用方法
1）indexOf：用来找到数组中某一项的索引，从前开始查找
语法：变量.indexOf(需要寻找的数组元素)
返回值：有返回索引，没有返回-1
2）lastIndexOf：用来找到数组中某一项的索引，从后开始查找
语法：变量.indexOf(需要寻找的数组元素)
返回值：有返回索引，没有返回-1
3）forEach：用来遍历数组，遍历每一个元素都会执行一次函数function（item，index）
语法：变量.forEach(function(item,index)){
}
item：遍历到的数组元素
index：对应的索引
4）map：用来遍历数组，可以对每一项进行操作，并返回一个新的数组
语法：变量.map(function(item,index)){
对item的操作
return item；
}
5）filter：按照制定的条件对数组进行筛选，筛选出满足条件的组成新的数组并返回
语法：变量.filter(function(item,index)){
对item的操作
return item；
}
每次循环都有返回值，不设置则默认为undefined，返回值会转为boolean型数据，为ture符合条件会放到新数组中，false不符合条件
三、数组的遍历
因为可以按照索引去获取数组内容，数组索引又是按0-n的顺序排列，所以可以通过for循环按顺序输出数组内数据，这种按顺序输出每一个数据叫做遍历。
通过for循环打印数组
for（var i=0;i
}
四、数组排序
1、冒泡排序
(从小到大冒泡)原理：遍历数组，比较数组（n位）内相邻的两个数据大小，如果前一个大于后一个两者交换位置，第一次遍历（n-1次）最大的数将移动到数组最后一个位置，第二次遍历（n-2次）第二大的数将移动到数组倒数第二个位置，第i次遍历（n-i次）第i大的数将移动到数组倒数第i个位置。
格式
for(var j=0;jarr[i]）{
var temp = arr[i];
arr[i] = arr[i+1]
arr[i+1] = temp
}
}
2、选择排序
原理：假定第0个就是最小数字对应的索引，遍历数组，只要有比第0个数字小的就将0替换为当前数字对应的索引，遍历结束就能找到最小数对应的索引n，最后将arr[0]与arr[n]对换；依次对第1、2、……、n进行选择排序，最后得到的数组内数据就是按从小到大排序的
格式
for（var i = 0；i < arr.length-1；i++）{
var minIndex = i
for(var j = i+1;j < arr.length; j++){
if（arr[minIndex]>arr[i]）{
minIndex = i
}
}
var temp = arr[i];
arr[i] = arr[minIndex]
arr[minIndex] = temp
}
五、练习题
以下练习题均为本人培训过程中老师当天布置的练习题，对理解数组有很大的帮助，我会将个人的解题代码放置最后，个人水平有限仅供参考
强化练习1
-
定义一个含有30个整型元素的数组，按顺序分别赋予从2开始的偶数；然后按顺序每五个数求出一个平均值，放在另一个数组中并输出。试编程。
var arr = [2, 4, 6, 8, ..., 60] // 结果是一个新的数组 // [6, 16, 26, 36, 46, 56] -
通过循环按执行顺序，做一个5×5的二维数组，赋1到25的自然数，然后输出该数组的左下半三角。试编程。
// 结果 [ [1, 2, 3, 4, 5], [6, 7, 8, 9, 10], [11, 12, 13, 14, 15], [16, 17, 18, 19, 20], [21, 22, 23, 24, 25] ]
强化练习2
-
随机生成一个五位以内的数，然后输出该数共有多少位，每位分别是什么
-
数组的冒泡排序
-
数组的选择排序
-
编写函数map(arr) 把数组中的每一位数字都增加30%，并返回一个新数组
var arr = [10, 100, 1000] function map() { // code in here ... } console.log(map(arr)) // [13, 130, 1300] -
编写函数has(arr , 60) 判断数组中是否存在60这个元素，返回布尔类型
var arr = [1, 2, 3, 60]
var arr2 = [1, 2, 3]
function has() {
// code in here ...
}
console.log(has(arr, 60)) // true
console.log(has(arr2, 60)) // false
强化练习3
-
编写函数norepeat(arr) 将数组的重复元素去掉，并返回新的数组
var arr = [1, 1, 2, 3, 4, 4, 2, 1, 3, 5] function norepeat() { // code in here ... } console.log(norepeat(arr)) // [1, 2, 3, 4, 5] -
有一个从小到大排好序的数组。现输入一个数，要求按原来的规律将它插入数组中。
-
创建一个对象，该对象存储一个学生的信息，该对象包含学号、身份证、年龄、性别、所学专业等属性信息，同时该对象包含一个自我介绍的方法，用来输出该对象的所有信息
// 强化练习1
// 1 定义长度30的数组,每五个求平均数存储到另一个数组中
function arr_defin(){
var arr = [30]
var arr_ave = []
var k = 0
for(i=0;i<30;i++){
arr[i]=2*(i+1)
if((i+1)%5 == 0){
var sum = 0
for(j=i-4;j<=i;j++){
sum += arr[j]
}
arr_ave[k] = sum/5
k ++
}
}
console.log(arr)
console.log(arr_ave)
}
// 2 5x5二维数组,赋值1到25,输出左下半三角
function arr_two_dimensional(){
// 创建5x5数组，赋值1到25
var arr_1 = [5]
for(i=0;i<5;i++){
var arr_2 = [5]
for(j=0;j<5;j++){
arr_2 [j] = 5*i + j + 1
}
arr_1[i] = arr_2
console.log(arr_1[i])
}
// 输出左下半三角
var arr_3 = [5]
for(i=0;i<5;i++){
var arr_4 = []
for(j=0;j<=i;j++){
arr_4[j] = arr_1[i][j]
}
arr_3[i] = arr_4;
console.log(arr_3[i])
}
}
// 强化练习2
// 1 随机生成一个五位以内的数,输出共有多少位,每位是什么
function arr_rnum(){
var a = parseInt(Math.random()*10000)
var arr_a = []
for(i=0;i<5;i++){
if(a/10>1){
arr_a[i] = a%10
a = parseInt(a/10)
}else{
arr_a[i] = a%10
console.log("该数共有："+(i+1)+"位")
return "从高位到低位分别是："+arr_a
}
}
}
// 2 冒泡排序
function arr_bubbleSort(){
// 创建一个长度20的随机数组
var arr_1 = []
for(i=0;i<20;i++){
arr_1[i] = parseInt(Math.random()*100)
}
console.log("参与冒泡排序的数组为：")
console.log(arr_1)
// 进行冒泡排序
for(k=0;k<arr_1.length-1;k++){
for(j=0;j<arr_1.length-1-k;j++){
if(arr_1[j]<arr_1[j+1])
{
var temp = arr_1[j];
arr_1[j] = arr_1[j+1];
arr_1[j+1] = temp
}
}
}
console.log("经过冒泡排序的数组：")
console.log(arr_1)
return arr_1
}
// 3 选择排序
function arr_selectSort(){
// 创建一个长度20的随机数组
var arr_1 = []
for(i=0;i<20;i++){
arr_1[i] = parseInt(Math.random()*100)
}
console.log("参与选择排序的数组为：")
console.log(arr_1)
// 进行选择排序
for(k=0;k<arr_1.length-1;k++){
var minIndex = k
for(j=k+1;j<arr_1.length;j++){
if(arr_1[minIndex]<arr_1[j])
{
minIndex = j
}
}
var temp = arr_1[k];
arr_1[k] = arr_1[minIndex];
arr_1[minIndex] = temp
}
console.log("经过选择排序的数组：")
console.log(arr_1)
}
// 随机生成一个长度为20的数组，每个数据在3位数以内
var arr = []
for(i=0;i<20;i++){
arr[i] = parseInt(Math.random()*100)
}
// 4 编写函数,数组里每一个数增加30%,返回新的数组
function map(arr){
console.log("获取到的原数组为：")
console.log(arr)
var arr_new = []
for(i=0;i<arr.length;i++){
arr_new[i] = parseFloat((arr[i] * 1.3).toFixed(2));
}
console.log("增加后的新数组为：")
console.log(arr_new)
console.log("获取到的原数组为：")
console.log(arr)
}
// 5 判断是否存在元素60,返回布尔值
var arr1 = [1, 2, 3, 60]
var arr2 = [1, 2, 3]
function has(arr,num){
for(i=0;i<arr.length;i++){
if(arr[i] == 60){
return true;
}
}
return false;
}
// 强化练习3
// 1 去除重复元素
var arr_no = [1, 1, 2, 3, 4, 4, 2, 1, 3, 5]
// 去重函数
function arr_noRepeat(arr){
var arr_new = []
var arr_print = []
var j = 0
arr_new = arr_nobubble(arr)
console.log("需要去重的数组为：")
console.log(arr_new)
for(i=0;i<arr_new.length;i++){
if(arr_new[i] == arr_new[i+1]){
continue;
}else{
arr_print[j] = arr_new[i]
j ++
}
}
console.log("去重后的数列为：")
console.log(arr_print)
}
//冒泡排序从小到大
function arr_nobubble(arr_1){
// 创建一个长度20的随机数组
// 进行冒泡排序
for(k=0;k<arr_1.length-1;k++){
for(j=0;j<arr_1.length-1-k;j++){
if(arr_1[j]>arr_1[j+1])
{
var temp = arr_1[j];
arr_1[j] = arr_1[j+1];
arr_1[j+1] = temp
}
}
}
return arr_1
}
// 2 从小到大排序的数组插入一个数字按原来规律排序
function arr_sort(num){
var arr_orig = []
// 这个for循环是为了把排序好的数组arr_1内容传递给新数组arr_orig,如果使用直接赋值会导致arr_orig与arr_1地址绑定,使得每调用一次arr_sort函数，数组长度便会加一。
for(i = 0;i < arr.length;i++)
{
arr_orig[i] = arr_nobubble(arr)[i]
console.log("随机生成排列好的数组为")
}
console.log(arr_orig)
for(i=0;i<arr_orig.length;i++){
if(arr_orig[i] > num){
arr_orig.splice(i,0,num)
console.log("插入后的数组为：")
console.log(arr_orig)
return
}
}
}
// 3 创建对象,存储信息,输出所有信息
var obj = { }
obj.student = 123456;
obj.studentID = 321789546642;
obj.age = 18;
obj.gender = "男";
obj.major = "移动通信";
function obj_print(obj){
var attribute = ''
var a_value = ''
for(var key in obj){
if ( typeof( obj[key] ) === "function" ){
attribute += '属性：' + key + '\r\n'
} else {
// p 为属性名称，obj[p]为对应属性的值
a_value += '属性：' + key + " = " + obj[key] + "\r\n" ;
}
}
return attribute,a_value
}
学习笔记链接
1、Javascript由来及书写方式
JS学习笔记——入门基础知识总结
2、数据类型与简单运算
JS学习笔记——入门基础知识总结（数据类型与简单运算）
3、选择语句if、switch及练习题
JS学习笔记——入门基础知识总结（选择语句）
4、循环语句while、dowhile、for及练习题
JS学习笔记——入门基础知识总结（循环语句）
5、函数、预解析、作用域
JS学习笔记——基础知识总结（函数）
6、数组、冒泡排序、选择排序【本篇】
JS学习笔记——基础知识总结（数组）