1、有這樣一個URL：http://item.taobao.com/item.htm?a=1&b=2&c=&d=xxx&e，請寫一段JS程序提取URL中的各個GET參數(參數名和參數個數不確定)，將其按key-value形式返回到一個json結構中，如{a:’1′, b:’2′, c:”, d:’xxx’, e:undefined}。
主要考察字符串的split()的方法：把一個字符串分割成字符串數組。
- 語法：stringObject.split(separtor,howmany)
separtor：必需，字符串或正則表達式，從該參數指定的地方分割 stringObject。
howmany：可選。該參數可指定返回的數組的最大長度。如果設置了該參數，返回的子串不會多于這個參數指定的數組。如果沒有設置該參數，整個字符串都會被分割，不考慮它的長度。- 返回值：一個字符串數組。
該數組是通過在 separator 指定的邊界處將字符串 stringObject 分割成子串創建的。返回的數組中的字串不包括 separator 自身。- 注意：如果把空字符串 ("") 用作 separator，那么 stringObject 中的每個字符之間都會被分割。
代碼.png
運行以后.png
2、看下面代碼，給出輸出結果
for(var i=1;i<=3;i++){
setTimeout(function(){
console.log(i)
},0)
};
答案：4 4 4
原因：setTimeout會在js引擎空閑的時候再執行，JavaScript事件處理器在線程空閑之前不會運行。
如何讓上述代碼輸出1 2 3？
for(var i=1;i<=3;i++){
//改成立即執行函數
setTimeout((function(a){
console.log(a);
})(i),0);
};
答案：1 2 3
3、數組去重
var arr=[1,2,3,1,3,2,3,5,6,5]
- 第一種方法（for循環的方法）
var result=[];
for(var i=0;i<arr.length;i++){
var flag=true;
for(var j=i;j<arr.length;j++){
if(arr[i]==arr[j+1]){
flag=false;
break;
}
}
if(flag){
result.push(arr[i]);
}
}
console.log(result);
- 第二種方法（對象的方法）
var arr1=[];
var obj={};
for(var i=0;i<arr.length;i++){
if(!obj[arr[i]]){
arr1.push(arr[i]);
obj[arr[i]]=1;
}
}
console.log(arr1);
- 第三種方法（用indexOf()）
var arr2=[];
for(var i=0;i<arr.length;i++){
if(arr2.indexOf(arr[i])===-1){
arr2.push(arr[i]);
}
}
console.log(arr2);
- 第四種方法（es6的Set數據結構）
let s = new Set(arr);
console.log(s);
4、去除字符串兩頭的空格
var str=" Hello World "
- 方法一（for循環）
//去掉頭部空格
var str1;
for(var i=0;i<str.length;i++){
if(str[i]!=" "){
str1=str.substring(i);
break;
}
}
//去掉尾部空格
var str2;
for(var j=str1.length-1;j>=0;j--){
if(str1[j]!=" "){
str2=str1.substring(0,j+1);
//提取字符串substring(0,j+1) [)左閉右開；第一個參數是開始位置，第二個參數是結束位置
}
}
- 方法二（RegExp正則表達式）
var p=/^\s+|\s+$/g;
var s=str.replace(p,"");
console.log(s);
- 方法三（jquery）
需要先引入jquery庫
var str1=$.trim(str);
console.log(str1);
5、倒計時
距離2018年還有多少天
- 第一種做法
<body>
<div id="time"></div>
<script type="text/javascript">
var time=document.getElementById("time");
function clock(){
var targetDate= new Date(2018,0,1);
var currentDate= new Date();
var remainTime=targetDate-currentDate;
//天數
remainDay=parseInt(remainTime/1000/60/60/24);
//小時
remainHours=parseInt(remainTime/1000/60/60%24);
//分鐘
remainMinutes=parseInt(remainTime/1000/60%60);
//秒
remainSecond=parseInt(remainTime/1000%60);
time.innerHTML=remainDay+"天"+remainHours+"小時"+remainMinutes+"分鐘"+remainSecond+"秒"
setTimeout(clock,1000);
}
clock();
</script>
</body>
- 第二種做法
<body>
<div id="box"></div>
<script type="text/javascript">
var box=document.getElementById("box");
var t=null
function clock(time){
var targetDate=new Date(time);
var nowDate=new Date();
var remainDate= targetDate-nowDate;
if(remainDate<0){
clearInterval(t);
}
//天數
var remainDay=parseInt(remainDate/1000/60/60/24);
//小時
var remainHours=parseInt(remainDate/1000/60/60%24);
//分鐘
var remainMinute=parseInt(remainDate/1000/60%60);
//秒數
var remainSecond=parseInt(remainDate/1000%60);
box.innerHTML=remainDay+"天"+remainHours+"小時"+remainMinute+"分鐘"+remainSecond+"秒"
}
clock("2018/1/1");
t=setInterval(clock,1000,"2018/1/1");
//定時器后面可以傳值
</script>
</body>
- 第三種做法
<body>
<ul>
<li id="time_d"></li>
<li id="time_h"></li>
<li id="time_m"></li>
<li id="time_s"></li>
</ul>
<script src="lib/js/jquery-1.11.1.js"></script>
<script type="text/javascript">
$(function(){
showTime();
});
function showTime(){
var time_start=new Date().getTime();//獲取當前時間
var time_end=new Date("2018/10/1 00:00:00").getTime();//設置過去的時間
// 計算時間差
var time_distance = time_end - time_start;
// 天
var int_day = Math.floor(time_distance/86400000)
time_distance -= int_day * 86400000;
// 時
var int_hour = Math.floor(time_distance/3600000)
time_distance -= int_hour * 3600000;
// 分
var int_minute = Math.floor(time_distance/60000)
time_distance -= int_minute * 60000;
// 秒
var int_second = Math.floor(time_distance/1000)
// 時分秒為單數時、前面加零
if(int_day < 10){
int_day = "0" + int_day;
}
if(int_hour < 10){
int_hour = "0" + int_hour;
}
if(int_minute < 10){
int_minute = "0" + int_minute;
}
if(int_second < 10){
int_second = "0" + int_second;
}
// 顯示時間
$("#time_d").html(int_day);
$("#time_h").html(int_hour);
$("#time_m").html(int_minute);
$("#time_s").html(int_second);
// 設置定時器
setTimeout("showTime()",1000);
}
</script>
</body>
6、cookies、sessionStorage與localStorage的區別
（1）cookie在瀏覽器和服務器間來回傳遞，而sessionStorage和localStorage不會自動把數據發給服務器，僅在本地保存。
（2）存儲大小限制也不同，cookie數據不能超過4k，sessionStorage和localStorage 可以達到5M或更大。
（3）數據有效期不同，sessionStorage：僅在當前瀏覽器窗口關閉前有效，localStorage：始終有效，窗口或瀏覽器關閉也一直保存，cookie只在設置的cookie過期時間之前一直有效
（4）作用域不同，sessionStorage不在不同的瀏覽器窗口中共享，即使是同一個頁面；localStorage 在所有同源窗口中都是共享的；cookie也是在所有同源窗口中都是共享的。
