A.今天學(xué)到了什么
1.數(shù)組
1.1命名方式
<script>
// 直接量的方式
var arr=[1,2,3];
// 構(gòu)造函數(shù)的方式（了解）
var b =new Array();
b[0]=1;
// 檢測一個數(shù)據(jù)是不是數(shù)組
// instanceof 返回boolean值
// Array.isArray();返回boolean值
console.log(b instanceof Array);
</script>
1.2 增加
<script>
// push 從后增加
var arr=[1,2,3];
arr.push(4);
console.log(arr);
// unshift 從頭添加
arr.unshift(0);
console.log(arr);
</script>
1.3 concat增加
<script>
var arr=[1,2,3];
var b=arr.concat(4);
console.log(arr);
console.log(b);
</script>
1.4數(shù)組的克隆
<script>
var arr=[1,2,3];
var b=[];
// 1.push
for(var i=0;i<arr.length;i++){
b.push(arr[i]);
}
console.log(b);
// 2.concat
var c=[4,5,6];
var d=c.concat([7,8]);
console.log(d);
</script>
1.5 數(shù)組刪除
<script>
// 從后面刪除
var arr=[1,2,3];
arr.pop();
// console.log(arr);
// 從頭刪除
arr.shift();
console.log(arr);
</script>
1.6 數(shù)組的修改
<script>
var arr=[1,2,3,4];
arr.splice(1,1,"h");
console.log(arr);
</script>
1.7 查詢
<script>
var arr=[1,2,3,4];
// indexOf 查詢對應(yīng)的下標(biāo)
// arr.slice(開始的下標(biāo) 結(jié)束的下標(biāo)) 不包含結(jié)束的下標(biāo)
var a=arr.indexOf(4);
var b=arr.slice(0,2);
console.log(b);
// 傳一個參數(shù)
var c=arr.slice(0);
console.log(c);
</script>
1.8 splice用法
<script>
// 1.增加
var arr=[1,2,3,4];
// arr.splice(2,0,"hello");
// console.log(arr)
// 2.刪除
arr.splice(2,1);
console.log(arr)
</script>
#######1.9 join 的用法
<script>
// w3cschool
// join 將數(shù)組轉(zhuǎn)為一個字符串
var arr=["hello","world","good"];
var b=arr.join();
var c=arr.join("|");
var d=arr.join("");
console.log(d);
</script>
2 數(shù)組排序
<script>
var arr=[232,34,235,65,82,934,93,6,43]
// 升序
var b=arr.sort(function(a,b){
return a-b;
// 降序 b-a
});
console.log(b);
</script>
3 數(shù)組求和
<script>
var arr=[123,3,343,343];
// 求和
var b=arr.reduce(function(a,b){
return a+b;
});
var c=arr.reverse();
// console.log(b);
console.log(c);
// 二維數(shù)組
var arr1=[[1,2],[2,3],[3,4],[4,5],"hello"];
console.log(arr1[0][0]);
</script>
4 swiper輪播
5 字符串常用方法
1.獲取字符串的長度
var str="hello world";
var len=str.length;
// console.log(len);
2.增加
var add=str.concat("add");
// console.log(add);
3.查詢 輸出對應(yīng)下標(biāo)的字符
var char=str.charAt(2);
// console.log(char);
4.indexOf 輸出對應(yīng)字符的下標(biāo)
var b=str.indexOf("l");
// console.log(b);
// 截取
var c=str.slice(1,4);
// console.log(c);
// 基本類型的方法不能改變原來的值
// substr(index,length)
// substring(startindex,endindex)
var e=str.substr(1,3);
var d=str.substring(1,4);
// console.log(e);
5.將字符串分割成數(shù)組
var h=str.split("");
console.log(h);
//
</script>
6 字符串的其他方法
<script>
// search 方法 返回搜索值的下標(biāo)
// 如果字符不存在 返回-1
var a ="hello world ";
var b=a.search("h");
console.log(b);
// match 方法 返回一個數(shù)組
// 如果字符不存在 返回null
var c=a.match("e");
console.log(c);
// replace 替換掉第一個hello字符
var d=a.replace("hello","good");
// 替換所有的字符
var e=a.replace(/l/g,"*");
console.log(e);
</script>
7 正則表達式
7.1寫法
var a="hello world"
// 正則表達式寫法
var reg=/l/g;
// var reg=new RegExp("l","g");
var b=a.replace(reg,"*");
console.log(b);
7.2 備選字符集
// 備選字符集
var c="上海,上天走,上去,上來";
var reg=/上[海走]/g;
var d=c.replace(reg,"**");
console.log(d);
var e="12334232d"
var h=/[0-9]/g;
console.log(e.replace(h,"*"));
// 字符集
// [a-z] [A-Z] [0-9]
7.3 預(yù)訂字符集
//預(yù)定義字符集
// \d [0-9]
// \w 數(shù)字 字母或者下劃線
// \s 除換行以外所有的字符 空格 tab .
//
var u="hello 132321"
var reg=/\d/g;
console.log(u.replace(reg,"**"));
7.4 量詞
<input type="text" id="txt">
<button id="btn">btn</button>
<script>
// 量詞 規(guī)定字符出現(xiàn)的次數(shù)
// 正則表達式自帶test()方法 返回boolean
// {9}確定數(shù)量
// {3,6}出現(xiàn)3-6次
// {3,}至少出現(xiàn)三次
var txt=document.getElementById("txt");
var btn=document.getElementById("btn");
var reg=/^\d{6}$/;
btn.onclick=function(){
var value=txt.value;
var result=reg.test(value);
console.log(result);
if(result){
alert("輸入的是正確的");
}else{
alert("只能輸入6位數(shù)字");
}
}
// 不確定數(shù)量的量詞
// + 出現(xiàn)一次或多次
// ？ 出現(xiàn)0次或1次
// * 出現(xiàn)0次或多次
</script>
7.5選擇和分組
<input type="text" id="txt">
<button id="btn">btn</button>
<script>
// ^以xx開頭 $以xx結(jié)尾
var reg=/^(\+08|0086)?\s*1[3456789]\d{9}$/;
var txt=document.getElementById("txt");
var btn=document.getElementById("btn");
btn.onclick=function(){
var value=txt.value;
var result=reg.test(value);
console.log(result);
if(result){
alert("輸入的是正確的");
}else{
alert("請輸入正確的電話號碼");
}
}
</script>
7.6 自定匹配位置
<script>
// 排除 [^abc] 除了abc
var a=" hello";
var reg=/^\s+/g;
console.log(a);
console.log(a.replace(reg,""));
var b="sahenfks";
var reg=/[^s]/g;
console.log(b.replace(reg,"e"));
</script>
7.7 電話號碼選擇
<script>
// 以 +08或者0086 可有可無
// 可以有多個空格或者沒有
// 第一位為1 第二位為3456789 最后九位為數(shù)字
var reg=/^(\+08|0086)?\s*1[3456789]\d{9}$/
</script
7.8 match
<script>
// match也可以傳正則表達式
var str = "hello 13231234 434";
var reg=/\d+/g;
var arr=str.match(reg);
console.log(arr);
</script>
7.9 過濾
<textarea id="txt" cols="30" rows="10"></textarea>
<button id="btn">過濾</button>
<script>
var reg= /天貓|淘寶/g;
var txt=document.getElementById("txt");
var btn=document.getElementById("btn");
btn.onclick=function(){
var value=txt.value;
var filter=value.replace(reg,"**");
txt.value=filter;
}
</script>
7.10 郵箱的正則
<input type="text" id="txt">
<p id="content"></p>
<button id="btn">驗證</button>
<script>
// 一串?dāng)?shù)字碧聪，字幕或下劃線@一串?dāng)?shù)字 英文，一串英文
var reg=/^\w+@[a-z0-9]+\.[a-z]+$/
var txt=document.getElementById("txt");
var btn=document.getElementById("btn");
var content=document.getElementById("content");
btn.onclick=function(){
var value=txt.value;
var result =reg.test(value);
if(result){
content.innerHTML="郵箱正確";
content.style.color="green";
}else{
content.innerHTML="郵箱格式不正確";
content.style.color="red";
}
}
</script>
7.11總結(jié)
字符串中支持正則的方法
strObj.search(regExp)
search()
match()
replace()
split()
正則自帶方法
test() 檢測一個字符串是否匹配某個模式 返回值為boolean
regExp.test(strObj)
