Web前端之JS概述、函数和数组（7）——数组

一、复习

1.匿名函数 function(){ }
2.函数声明 function fn(){ }
3.创建函数——函数表达式

 var fn=function(a,b){ return a+b; }

4.匿名函数自调用

 (function(){    })();

5.回调函数——匿名函数以参数形式传递

 function add(a){ a()  }
   a(function(){  })

6.对象
内置对象、宿主对象、自定义对象
创建对象

var person={name:'tom',....}
var person=new Object();
person.name='tom';
person['age']=20;

对象属性的访问和遍历属性

  for(var key in person){
       person[key]
    }
  检测属性是否存在
   'name' in person
   person.hasOwnProperty('age')
   person.price===undefined 
  对象中的方法
   var person={
      say:function(){   }
   }
   person.say();

二、学习一门编程语言的基本步骤

(1)了解背景知识：历史、现状、特点、应用场景
(2)搭建开发环境：编写hello world
(3)变量和常量
(4)数据类型
(5)运算符
(6)逻辑结构
(7)通用小程序
(8)函数和对象
(9)第三方库、框架
(10)实用的项目

三、 数组

数组是由多个元素组成的集合，是数据集合。每一个元素就是一个数据。
1.创建数组
(1)数组字面量

[元素1,元素2...]

数组中可以存放任意类型的数据

(2)内置构造函数

 new Array(元素1,元素2...)
 new Array(5)   //初始化数组长度为5，可以继续添加第6个第7个...！！！

访问数组中的元素：
数组名称[下标] 下标从0开始
如果下标中没有元素，返回undefined。
练习：创建数组，保存若干个用户名
练习：创建数组，初始化长度为3，添加3门课程。

//练习：创建数组，保存若干个用户名
var uname=new Array('jingjing','dingding','dongdong','dangdang');`
uname[4]='huahua';
uname[3]='ddang';
console.log(uname);
//练习：创建数组，初始化长度为3，添加3门课程。
var course=new Array(3);
course[0]='语文';
course[1]='数学';
course[2]='英语';
console.log(course);
console.log(course[5]);

2.获取数组元素的个数

  数组.length

使用数组元素个数可以在最后添加一个新元素

  数组[ 数组.length ] = '数据';

练习：创建一个空数组，使用数组的长度添加3个手机品牌。

var phone=[];
phone[phone.length]='华为';
phone[phone.length]='OPPO';
phone[phone.length]='小米';
console.log(phone);

3.数组分类
数组分为关联数组和索引数组
关联数组：以字符串作为下标，需要单独添加每个元素。
索引数组：以正整数作为下标。

4.遍历数组元素
(1)for-in

 for(var key in person){
    key  要遍历的元素的下标
    person[key]   每个元素下标对应的数据
 }

既可以遍历关联数组，也可以遍历索引数组

(2)for循环

var arr=['a','b','c'];
 for(var i=0;i<arr.length;i++){
    i  代表数组的下标，从0开始
    arr[i]  下标对应的元素
 }

只能遍历索引数组

练习1：创建数组，保存若干个学生的成绩，计算平均成绩。
练习2：创建数组，保存若干个汽车的品牌，把’宝马’改为’BMW’
练习3：创建函数getCount，传递两个参数(数组，要查找的元素)，返回要查找的元素在数组中出现的次数。
练习4：创建函数getAvg，传递一个参数(数组中保存了若干个成绩)，返回平均分。
练习5：创建函数getIndex，传递两个参数(数组，要查找的元素)，如果找到，返回下标，如果找不到返回-1.

1  //练习：创建数组，保存若干个学生的成绩，计算平均成绩。
var score=[82,79,69,99,86,72,66];
//获取总的成绩
for(var i=0,sum=0;i<score.length;i++){
  sum+=score[i];
}
//console.log(sum/score.length);

2. //练习：创建数组，保存若干个汽车的品牌，把'宝马'改为'BMW'
var car=['奔驰','奥迪','宝马','奥拓','宝马','宝骏'];
//遍历数组中的元素
for(var i=0;i<car.length;i++){
  //查看元素是否为‘宝马’
  if(car[i]=='宝马'){
    //如果为true，把该元素的数据改为'BMW'
    car[i]='BMW'
  }
}
console.log(car);
 3. function getCount(arr,value){
  //要查找value在arr中出现的次数
  //声明一个变量保存出现的次数，初始化0
  //遍历数组中的元素，如果满足，次数加1
  for(var i=0,count=0;i<arr.length;i++){
    //如果元素的值为 value，count加1
	if(arr[i]==value){
	  count++;
	}
  }
  return count;
}

 //console.log( getCount(['a','c','b','c'],'d') );
 4.//练习：创建函数getAvg，传递一个参数(数组中保存了若干个成绩)，返回平均分。
function getAvg(arr){
  //遍历arr，获取每个元素的和，再除以元素个数
  for(var i=0,sum=0;i<arr.length;i++){
    sum+=arr[i];
  }
  return sum/arr.length;
}
//console.log(getAvg([83,79,65,92]));
//console.log( getAvg([65,53,49]) );

5.//练习：创建函数getIndex，传递两个参数(数组，要查找的元素)，如果找到返回下标，如果找不到返回-1.
function getIndex(arr,value){
  //查找数组arr中的value元素
  //遍历数组arr
  for(var i=0;i<arr.length;i++){
    //判断数组中的元素是否为value
	if(arr[i]==value){
	  //如果满足条件，说明找到，返回下标
	  return i;
	}
	//else{
	  //如果第一个元素不满足
	//}
  }
  //如果以上所有的元素都没有找到
  return -1;
}
console.log(getIndex(['a','b','c','d'],'e'));

5.数组中的方法(API)
API - 应用程序编程接口，预先定义好的函数/方法
toString() 数组中的元素转为字符串，按照逗号分隔
join() 数组中的元素转为字符串，按照指定的字符分隔数组中的元素。 join(’#’)按#分隔，如果空就是空。
concat(arr1,arr2...) 拼接两个或者更多的数组
slice(start,end) 截取数组中的元素，start开始的下标，end结尾的下标，不包含end本身；负数表示倒数第n个

练习：创建数组，保存a~h，每个元素存储1个字母，截取bc和ef，拼接成一个新数组。

var a=['a','b','c','d','e','f','g','h'];
var b=a.slice(1,3);
var c=a.slice(-4,-2);
console.log(b.concat(c));

splice(start,count,value1,value2...) 删除数组中的元素，start开始的下标，count删除的数量，value1,value2删除后替换的元素。start为负值表示倒数第n个
reverse() 翻转数组中的元素

var arr=['a','b','c'];
console.log(arr.reverse());//输出['c','b','a']

sort() 对数组中的元素进行排序，默认按照Unicode码由小到大排序

sort(function(a,b){
  return a-b;  //数字由小到大
  //return b-a;  //数字由大到小
});

四、课后任务

(1)复习今天内容，整理思维导图
(2)练习
①创建函数getMax，传递一个参数(数组)，返回最大值。
②使用数组遍历来翻转数组中的元素
③了解冒泡排序，实现数字由大到小(由小到大)排序

1.function getMax(arr){
  var max=arr[0];
  for(var i=1;i<arr.length;i++){
	if(arr[i]>max){
	  max=arr[i];
	}
  }
  return max;
}

2.var ename=['tom','jerry','king','kate'];
var ename2=[];
for(var i=0;i<ename.length;i++){
  ename2[i]=ename[ename.length-1-i]
}

var a=1;
var b=2;
var c=a;
a=b;
b=c;
var arr=['tom','jerry'];
var tmp=arr[0];
arr[0]=arr[1];
arr[1]=tmp;

3.//冒泡排序——数字从小到大的排序
var arr=[23,9,78,6,45];
for(var i=1;i<arr.length;i++){
  for(var j=0;j<arr.length-i;j++){
    if(arr[j]>arr[j+1]){
	  var tmp=arr[j];
	  arr[j]=arr[j+1];
	  arr[j+1]=tmp;
	}
  }
}
console.log(arr);

(3)预习字符串方法