問答
數組方法里push、pop、shift、unshift、join、split分別是什么作用。（*）
var arr= [1,2,5,9,10];
- push : 在數組末尾添加值 arr.push(3,5)返回的是數組的length->7
- pop : 刪除數組的末位 arr.pop()
- shift : 刪除數組的首位 arr.shift()
- unshift : 數組頭部增加值,返回數組長度 arr.unshift(3,4,5) arr-->[3,4,5,1,2,3,9,10]
-
join : 在數組每個元素中添加值 demo:
數組1.png -
split : 用于把一個字符串分割成字符串數組 demo:
split.png
代碼
1. 數組
用 splice 實現 push、pop、shift、unshift方法 （***）
<pre>
var arr = [2,3,8,9,10,1,7];
// arr.splice(arr.length,0,val) // push
//arr.splice(arr.length-1) //pop
//arr.splice(0,1) // shift
//arr.splice(0,0,val) //unshift
</pre>使用數組拼接出如下字符串 （***）
<pre>
var prod = {
name: '女裝',
styles: ['短款', '冬季', '春裝']
};
function getTpl(data){
//todo...
};
var result = getTplStr(prod); //result為下面的字符串
<dl class="product"> <dt>女裝</dt> <dd>短款</dd> <dd>冬季</dd> <dd>春裝</dd> </dl>
</pre>
拼接:
<pre>
function getTplStr(prod){
var a = [];
a.push('<dl class="product">');
a.push('<dt>'+prod.name+'</dt>');
for(var i=0;i<prod.styles.length;i++){
a.push('<dd>'+prod.styles[i]+'</dd>')
}
a.push('</dl>');
console.log(a.join(''));
}
var result = getTplStr(prod);
輸出:
<pre>
<dl class="product"><dt>女裝</dt><dd>短款</dd><dd>冬季</dd><dd>春裝</dd></dl>
</pre>
</pre>寫一個find函數，實現下面的功能 （***）
<pre>
var arr = [ "test", 2, 1.5, false ]
find(arr, "test") // 0
find(arr, 2) // 1
find(arr, 0) // -1
</pre>
函數如下:
<pre>
var arr = [ "test", 2, 1.5, false ];
function find(arr, val){
return arr.indexOf(val)
}
find(arr, "test") // 0
find(arr, 2) // 1
find(arr, 0) //-1
</pre>寫一個函數filterNumeric，把數組 arr 中的數字過濾出來賦值給新數組newarr， 原數組arr不變 （****）
<pre>
arr = ["a", "b", 1, 3, 5, "b", 2];
newarr = filterNumeric(arr); // [1,3,5,2]
</pre>
函數如下:
<pre>
arr = ["a", "b", 1, 3, 5, "b", 2];
function filterNumeric(arr){
console.log(arr.filter(function (e) {
return e % 1 === 0;
}))
newarr = filterNumeric(arr); // [1,3,5,2]
arr//["a", "b", 1, 3, 5, "b", 2] // 原數組不變
</pre>對象obj有個className屬性，里面的值為的是空格分割的字符串(和html元素的class特性類似)，寫addClass、removeClass函數，有如下功能：(****)
<pre>
var obj = {
className: 'open menu'
}
addClass(obj, 'new') // obj.className='open menu new'
addClass(obj, 'open') // 因為open已經存在，所以不會再次添加open
addClass(obj, 'me') // me不存在，所以 obj.className變為'open menu new me'
console.log(obj.className) // "open menu new me"
removeClass(obj, 'open') // 去掉obj.className里面的 open，變成'menu new me'
removeClass(obj, 'blabla') // 因為blabla不存在，所以此操作無任何影響
</pre>
函數addClass如下:
<pre>
function addClass(obj,val){
var a = obj.className.split(' ');
if (a.indexOf(val)<0){
a.push(val);
a.join(' ');
obj.className = a.join(' ');
return obj.className;
}else{
return obj.className;
}
}
</pre>
函數removeClass如下:
<pre>
function removeClass(obj,val){
var a = obj.className.split(' ');
if (a.indexOf(val)>=0){
a.shift(val);
a.join(' ');
obj.className = a.join(' ');
return obj.className;
}else{
return obj.className;
}
}
</pre>
寫一個camelize函數，把my-short-string形式的字符串轉化成myShortString形式的字符串，如 (***)
<pre>
camelize("background-color") == 'backgroundColor'
camelize("list-style-image") == 'listStyleImage'
</pre>
函數 camelize 如下:
<pre>
function camelize(strs) {
var arr = strs.split('-');
if (arr.length === 1) {
return arr.join('');
} else {
for (var k = 1; k < arr.length; k++) {
arr[k] = arr[k][0].toUpperCase().concat( arr[k].substr(1,arr[k].length-1) );
}
return arr.join('');
}
}
</pre>如下代碼輸出什么？為什么? (***)
<pre>
arr = ["a", "b"];
arr.push(
function() {
alert(console.log('hello hunger valley')) // 先打印'hello hunger valley' 再彈出 undefined
} // 輸出結果是arr的長度 是 3
);
arr[ arr.length - 1 ] ()
</pre>
輸出:
<pre>
1, arr["a", "b",function(){}]
2, arr [arr.length-1] () === arr[ 2 ] () === 調用函數: ---> 先打印 'hello hunger valley' 然后彈出 undefined
</pre>寫一個函數filterNumericInPlace，過濾數組中的數字，刪除非數字。要求在原數組上操作 (****)
<pre>
arr = ["a", "b", 1, 3, 4, 5, "b", 2];
//對原數組進行操作，不需要返回值
filterNumericInPlace(arr);
console.log(arr) // [1,3,4,5,2]
</pre>
函數:
<pre>
function filterNumericInPlace(arr){
for (var j=0; j < arr.length;j++){
if(typeof arr[j] !== 'number') {
console.log( arr.splice(j,1));
j--;
}
}
}
filterNumericInPlace(arr);
console.log(arr) // [1,3,4,5,2]
**重點是j--,因為循環第一遍,如果typeof arr[0]≠number,j=j+1,
導致b 無法被取出,所以需要j-- ,回到原始位置,再進行條件判斷
</pre>寫一個ageSort函數實現數組中對象按age從小到大排序 （***）
<pre>
var john = { name: "John Smith", age: 23 }
var mary = { name: "Mary Key", age: 18 }
var bob = { name: "Bob-small", age: 6 }
var people = [ john, mary, bob ]
ageSort(people) // [ bob, mary, john ]
</pre>
函數:
<pre>
var john = { name: "John Smith", age: 23 };
var mary = { name: "Mary Key", age: 18 };
var bob = { name: "Bob-small", age: 6 };
var people = [ john, mary, bob ];
function ageSort(people){
people.sort(function(v1,v2){
return v1.age - v2.age;
});
}
console.log(people);
ageSort(people) // [ bob, mary, john ]
</pre>
輸出結果:
- 寫一個filter(arr, func) 函數用于過濾數組，接受兩個參數，第一個是要處理的數組，第二個參數是回調函數(回調函數遍歷接受每一個數組元素，當函數返回true時保留該元素，否則刪除該元素)。實現如下功能： （****）
<pre>
function isNumeric (el){
return typeof el === 'number';
}
arr = ["a",3,4,true, -1, 2, "b"]
arr = filter(arr, isNumeric) ; // arr = [3,4,-1, 2], 過濾出數字
arr = filter(arr, function(val) { return typeof val === "number" && val > 0 }); // arr = [3,4,2] 過濾出大于0的整數
</pre>
函數:1
<pre>
function isNumeric (el){
return typeof el === "number";
}
arr = ["a",3,4,true, -1, 2, "b"];
function filter(arr, isNumeric){
var newarr = arr.filter(isNumeric);
return newarr;
}
arr = filter(arr, isNumeric) // arr = [3,4,-1, 2] 過濾出數字
</pre>
函數:2
<pre>
function isInt (el){
return typeof el === "number" && el >0;
}
arr = ["a",3,4,true, -1, 2, "b"];
function filter(arr, isInt){
var newarr2 = arr.filter(isInt);
return newarr2;
}
arr = filter(arr, isInt) // arr = [3,4, 2] 過濾出>0 的數字
</pre>
字符串
寫一個 ucFirst函數，返回第一個字母為大寫的字符 （***）
<pre>
ucFirst("hunger") == "Hunger"
</pre>
函數如下:
<pre>
function ucFirst(val){
var a = val.substr(0,1);
return a.toUpperCase()+ val.substr(1,val.length-1);
}
ucFirst("hunger") // "Hunger"
</pre>寫一個函數truncate(str, maxlength), 如果str的長度大于maxlength，會把str截斷到maxlength長，并加上...，如 （****）
<pre>
truncate("hello, this is hunger valley,", 10)) == "hello, thi...";
truncate("hello world", 20)) == "hello world"
</pre>
函數1:數組操作
<pre>
function truncate(str, maxlength){
var d = str.split('');
if (d.length > maxlength){
d.splice(maxlength,d.length-maxlength,"...");
return d.join('');
}else{
return str;
}
}
</pre>
函數2:字符串操作
<pre>
function truncate(str, maxlength){
if (str.length > maxlength){
return str.substr(0,maxlength)+"...";
}else{
return str;
}
}
</pre>
結果:
數學函數
-
寫一個函數，獲取從min到max之間的隨機整數，包括min不包括max （*）
<pre>
function isMnumber(min,max){
var arr;
if (min<1){
arr = Math.ceil(min) + Math.floor( Math.random()(max-min) );
}else{
arr =Math.floor(min)+ Math.floor( Math.random()(max-min) );
}
return arr;
}
isMnumber(min,max) // min~max 之間的整數
</pre>
結果demo:
20B587EB-8585-430C-AB58-5168C1D269B3.png -
寫一個函數，獲取從min都max之間的隨機整數，包括min包括max （*）
<pre>
function isMnumber(min,max){
var arr;
if (min<1){
arr = Math.ceil(min) + Math.floor( Math.random()(max-min) );
}else{
arr =Math.floor(min)+ Math.floor( Math.random()(max-min+1) );
}
return arr;
}
isMnumber(min,max) // min~max 之間的整數含MAX
</pre>
結果demo:
18CE9509-BAB4-4802-B451-F3A4066E2654.png -
寫一個函數，獲取一個隨機數組，數組中元素為長度為len，最小值為min，最大值為max(包括)的隨機整數 （*）
<pre>
function adrr(min,max,len){
var narr = [];
for(var i= 0;i < len;i++){
if( min < 1 ){
narr.push( Math.ceil(min) + Math.floor( Math.random()(max-min)) );
}else{
narr.push( Math.floor(min) + Math.floor( Math.random()(max-min+1)) );
}
}
return narr;
}
adrr(1,12,4);//輸出結果見下方
</pre>
答案demo:
0B3C2F52-E0D0-4B24-98CC-73FE4DF19C91.png -
寫一個函數，生成一個長度為 n 的隨機字符串，字符串字符的取值范圍包括0到9，a到 z，A到Z。
<pre>
function getRandStr(len){
var strrr = '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ';
var result = '';
for(t = 0;t < len;t++ ){
result += strrr[Math.floor( Math.random()* strrr.length )];
}
return result;
}
var str = getRandStr(10); // 調用函數結果如下:
</pre>
函數結果demo:
B9480AFC-8D0F-4756-AB3B-35FDB07BF8CA.png
*本文作者版權歸Q:2361597776 所有,轉載請注明出處!
