WEB基础入门十：数组和while循环及字符串处理
1、面向对象的方式创建
var aRr01 = new Array(1,2,3,'abc');
2、直接创建
var aRr02 = [1,2,3,'def'];//推荐使用，性能更高
3、获取数组的成员数量（长度）
alert(aRr02.length);//弹出4
var aRr03 = [[1,2,3],['a','b','c','d'],[true,false]];
// alert(aRr03.length);//弹出3
// alert(aRr03[1].length);//弹出3
alert(aRr03[1][2]);//弹出c
4、数组常用方法
- join() 链接数组元素并转为字符串
- push 向数组最后追加元素
- pop 删除末尾元素
- unshift 向最前面插入元素
- shift 删除第一个（索引为?的）元素
- reverse 反转
- indexof 查找元素第一次出现的索引
- splice(a,b) 从第a索引元素开始，删除b个元素
- splice(a,b,'e') 从第a索引元素开始，删除b个元素，再插入e
//var sTr = aRr.join("-");//用-连接数组元素并转为字符串，弹出1-2-3-4
// var sTr = aRr.join('');//用空串连接
// alert(sTr);//弹出1234
//向数组最后追加元素
// aRr.push(5);
// alert(aRr);//1,2,3,4,5
//删除末尾元素
// aRr.pop();
// alert(aRr);//1,2,3
//向最前面插入元素0
// aRr.unshift(0);
// alert(aRr);//0,1,2,3,4
//删除第一个（索引为0的）元素
// aRr.shift();
// alert(aRr);//2,3,4
//反转
// aRr.reverse();
// alert(aRr);//4,3,2,1
//查找字母'b'第一次出现的索引
var aRr2 = ['a','b','c','d','a','b','c','d'];
var num = aRr2.indexOf('b');
// alert(num);//1
//从第2索引元素开始，删除1个元素
// aRr2.splice(2,1);//删除c
// alert(aRr2);//a,b,d,a,b,c,d
//从第2索引元素开始，删除1个元素，再插入e
// aRr2.splice(2,1,'e');//把c替换成e
// alert(aRr2);//a,b,e,d,a,b,c,d
//删除后面的abcd，改为fghi
aRr2.splice(4,4,'f','g','h','i');
alert(aRr2);//a,b,c,d,f,g,h,i
5、数组去重
var aRr = [1,3,4,1,6,9,1,2,5,3,1,6,5,4,4];
var aRr2 = [];
for(var i=0; i<aRr.length; i++){
//判断元素第一次出现的位置，恰好是当前索引时，就将元素放入新数组
if(aRr.indexOf(aRr[i]) == i){
aRr2.push(aRr[i]);
}
}
6、通过标签获取元素
获取页面上所有的li：var aLi = document.getElementsByTagName('li');
获取id为list01的ul：var oList = document.getElementById('list01');
再获取这个ul下的所有li：var aLi = oList.getElementsByTagName('li');
7、循环语句
通过循环语句可以反复的执行一段代码多次
- while循环
while(条件表达式){
语句...
}
while语句在执行时，先对条件表达式进行求值判断，如果值为true，则执行循环体，循环体执行完毕以后，继续对表达式进行判断，如果为true，则继续执行循环体，以此类推，如果值为false，则终止循环
- do...while循环
do{
语句...
}while(条件表达式)
do...while语句在执行时，会先执行循环体，循环体执行完毕以后，在对while后的条件表达式进行判断，如果结果为true，则继续执行循环体，执行完毕继续判断以此类推，如果结果为false，则终止循环
实际上这两个语句功能类似，不同的是while是先判断后执行，而do...while会先执行后判断，do...while可以保证循环体至少执行一次，而while不能
-
for 循环
在for循环中，为我们提供了专门的位置用来放三个表达式：1.初始化表达式；2.条件表达式；3.更新表达式
for(①初始化表达式;②条件表达式;④更新表达式){
③语句...
}
执行初始化表达式，初始化变量（初始化表达式只会执行一次）；执行条件表达式，判断是否执行循环，如果为true，则执行循环，如果为false，终止循环，执行更新表达式，更新表达式执行完毕继续重复
任意一种循环都可以互相嵌套
8、字符串处理方法
- split 字符串切断转成数组
- charAt(a) 获取指定索引a的字符
- indexof 查看子串第一次出现的位置，没有找到就弹出-1
- substring 截取子串
- substring(a,b) 从a开始，截到b(包括开始，不包括结束)
- toUpperCase() 全部转为大写字母
- toLowerCase() 全部转为小写字母
/*字符串切断转成数组*/
var sTr = '2018-06-20';
var aRr = sTr.split('-');
// alert(aRr);//2018,06,20
// console.log(aRr);
var aRr2 = sTr.split('');
// console.log(aRr2);
/*实际上就是修改了<title>标签的内容*/
// document.title = aRr2;
var sTr2 = '#div1';
var sTr3 = '.div1';
/*获取指定索引的字符*/
var sTr4 = sTr2.charAt(0);
if(sTr4 == '#'){
// alert('id选择器');
}
/*查看子串第一次出现的位置*/
var sTr5 = 'Microsoft Yahei';
var num = sTr5.indexOf('Yahei');
// alert(num);//10
var num2 = sTr5.indexOf('xihei');
// alert(num2);//没有找到就弹出-1
/*substring截取子串*/
//从10开始，截到15（包括开始位置，不包括结束位置）
// var sTr6 = sTr5.substring(10,15);//Yahei
//从10开始截取到末尾
var sTr6 = sTr5.substring(10);//Yahei
// alert(sTr6);
/*全部转为大写字母*/
// alert(sTr6.toUpperCase());//YAHEI
/*全部转为小写字母*/
alert(sTr6.toLowerCase());//yahei
9、字符串反转
1、split字符串转成数组
2、reverse数组反转
3、join数组转成字符串
var sTr = "123asdf79888asdfe21"
var sTr2 = sTr.split('').reverse().join('');
alert(sTr2);//12efdsa88897fdsa321
10、定时器弹框
1、setTimeout 只执行一次的定时器
2、clearTimeout 关闭只执行一次的定时器
3、setInterval 反复执行的定时器
4、clearInterval 关闭反复执行的定时器
11、定时器基本用法
//单次定时器
var timer = setTimeout(function(){
alert('hello!');
}, 3000);
//清除单次定时器
clearTimeout(timer);
//反复循环定时器
var timer2 = setInterval(function(){
alert('hi~~~');
}, 2000);
//清除反复循环定时器
clearInterval(timer2);
12、变量的作用域
全局变量：函数外部定义的变量，函数内部和外部都可以访问，它的值可以共享；
局部变量：函数内部定义的变量，函数内部可以访问，外部无法访问。函数内部访问变量时，先在内部查找是否有此变量，如果有，就使用内部变量，如果没有，就去外部查找；
函数内部如果不用'var'关键字定义变量，变量可能会变成全局变量，如果用严格模式解析会报错
13、封闭函数
封闭函数的一般写法
封闭函数定义：(function(){……})()
(function(){
var str = '欢迎访问我的主页';
alert(str);
})();//最后的()表示马上执行
封闭函数其他的写法：在匿名函数前加“！”或者“~”，之后加“()”
14、变量的方式命名函数
原来的写法：可以提前
myAlert();
function myAlert(){
alert('hello!');
}*/
//函数用变量方式定义：先定义再使用
// myalert();//提前会报错
var myAlert = function(){
alert('hello!');
}
myAlert();//放在下面可以执行
