JavaScript数组知识综合运用

问答

  • 数组方法里push、pop、shift、unshift、join、split分别是什么作用。(*)
    • push在数组末尾添加一个元素
    • pop从数组末尾删除一个元素
    • shift把数组的第一个元素删除掉
    • unshift在数组的头部添加一个元素
    • join() 将数组里面的元素以一定的方式:()内参数,连接成字符串
    • split() 是字符串方法,将一个字符串以()里面的内容为分割点分解成数组
    • splice(start[, deleteCount][, values]) 以第一个参数为起点,第二个参数为位移作为一个,将第三个参数替换这个范围。第二个参数省略则为插入操作,第三个参数省略为删除操作,均改变原数组

      代码题

      数组

      1、用 splice 实现 push、pop、shift、unshift方法 (*
      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      12
      13
      14
      15
      16
      17
      18
      19
      20
      21
      function push (arr,a) {
      arr.splice(arr.length,0,a);
      }
      function pop (arr) {
      arr.splice(arr.length-1,1);
      }
      function shift (arr) {
      arr.splice(0,1);
      }
      function unshift (arr,a) {
      arr.splice(0,0,a);
      }
      var arr=[2,5,11,7,4];
      push(arr,10)
      console.log(arr);
      pop(arr)
      console.log(arr);
      shift(arr)
      console.log(arr);
      unshift(arr,10)
      console.log(arr);

结果:0_1463473102454_upload-78650f2b-aa59-4db5-9fb8-55c4283598d2

2.使用数组拼接出如下字符串 (*

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
var prod = {
name: '女装',
styles: ['短款', '冬季', '春装']
};
function getTplStr(data){
var html = [];
html.push('<dl class="product">');
html.push("<dt>" + data.name + "</dt>");
for (var i = 0; i < data.styles.length; i++) {
html.push("<dd>" + data.styles[i] + "</dd>");
};
html.push("</dl>");
return html.join("\n");
};
var result = getTplStr(prod); //result为下面的字符串
console.log(result);

3.写一个find函数,实现下面的功能 (*

1
2
3
4
5
6
7
8
9
10
11
12
13

function find (arr,a) {
for (var i = 0; i < arr.length; i++) {
if(arr[i] === a){
return console.log(i);
}
};
return console.log(-1);
}
var arr = [ "test", 2, 1.5, false ]
find(arr, "test") // 0
find(arr, 2) // 1
find(arr, 0) // -1

4.写一个函数filterNumeric,实现如下功能 (**

1
2
3
4
5
6
7
8
9
10
11
12
var arr = ["a", 1,3,5, "b", 2];
function filterNumeric (arr) {
var arr0 = [];
for (var i = 0; i < arr.length; i++) {
if(typeof arr[i] === "number"){
arr0.push(arr[i]);
}

};
return arr0;
}
var newarr = filterNumeric(arr); // [1,3,5,2]

5.对象obj有个className属性,里面的值为的是空格分割的字符串(和html元素的class特性类似),写addClass、removeClass函数,有如下功能:(**)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
function addClass (obj,name) {
if (obj.className) {
var arr = obj.className.split(" ")
for (var i = 0; i < arr.length; i++) {
if(arr[i] === name){
return ;
}
};
arr.push(name);
obj.className = arr.join(" ");
};
}

function removeClass (obj,name) {
if (obj.className) {
var arr = obj.className.split(" ")
for (var i = 0; i < arr.length; i++) {
if(arr[i] === name){
arr.splice(i,1);
obj.className = arr.join(" ");
}
};
}
}

var obj = {
className: 'open menu'
}
addClass(obj, 'new') // obj.className='open menu new'
addClass(obj, 'open') // 因为open已经存在,此操作无任何办法
addClass(obj, 'me') // obj.className='open menu new me'
console.log(obj.className) // "open menu new me"

removeClass(obj, 'open') // obj.className='menu new me'
console.log(obj.className)
removeClass(obj, 'blabla') // 不变
console.log(obj.className)

6.写一个camelize函数,把my-short-string形式的字符串转化成myShortString形式的字符串,如 (*)

1
2
3
4
5
6
7
8
9
10
11
12
function camelize (str) {
var arr = str.split("-");
for (var i = 0; i < arr.length; i++) {
if(i>0 && typeof arr[i] === "string"){
arr[i] = arr[i].replace(arr[i][0],arr[i][0].toUpperCase());
}
};
str = arr.join("");
return str;
}
console.log(camelize("background-color"));
console.log(camelize("list-style-image") === 'listStyleImage');

7.如下代码输出什么?为什么? (*)

1
2
3
4
5
	arr = ["a", "b"];
arr.push( function() { alert(console.log('hello hunger valley')) } );
arr[arr.length-1]() //弹出undefind 控制台输出字符串hello hunger valley

/*arr.push()将函数function() { alert(console.log('hello hunger valley')) }加到arr数组的最后一位。arr.length-1是输出数组最后一位,即上面的函数,加()等于(function(){})立即执行函数表达式,函数执行console.log只在控制台输出,并不返回值,所以报undefind。*/

8.写一个函数filterNumericInPlace,过滤数组中的数字,删除非数字 (**)

1
2
3
4
5
6
7
8
9
10
11
var arr = ["a",1,3,4,5,"b",2];
//对原数组进行操作,不需要返回值
function filterNumericInPlace (arr) {
for (var i = 0; i < arr.length; i++) {
while(typeof arr[i] !== "number"){
arr.splice(i,1);
}//执行splice后数组指针i也移动,所以用while循环
};
}
filterNumericInPlace(arr);
console.log(arr) // [1,3,4,5,2]

9.写一个ageSort函数实现如下功能 (*

1
2
3
4
5
6
7
8
9
10
function ageSort (people) {
people.sort(function(a,b){
return a.age-b.age;
})
}
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 ]

10.写一个filter(arr, func) 函数用于过滤数组,接受两个参数,第一个是要处理的数组,第二个参数是回调函数(回调函数遍历接受每一个数组元素,当函数返回true时保留该元素,否则删除该元素)。实现如下功能: (**

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
function isNumeric (el){
return typeof el === 'number';
}
arr = ["a",3,4,true, -1, 2, "b"]

function filter (arr,funName) {
for (var i = 0; i < arr.length; i++) {
if(!funName(arr[i])){
arr.splice(i,1);
i--;
}
};
return arr;
}

arr = filter(arr, isNumeric) ; // arr = [3,4,-1, 2], 过滤出数字
console.log(arr);
arr = filter(arr, function(val) { return val > 0 }); // arr = [2] 过滤出大于0的整数
console.log(arr);

字符串

1.写一个 ucFirst函数,返回第一个字母为大写的字符 (*

1
2
3
4
5
function ucFirst (str) {
str = str.replace(str[0],str[0].toUpperCase());
return str;
}
console.log(ucFirst("hunger") === "Hunger");

2.写一个函数truncate(str, maxlength), 如果str的长度大于maxlength,会把str截断到maxlength长,并加上…,如 (**

1
2
3
4
5
6
7
8
9
function truncate (str,maxlength) {
if (str.length>maxlength) {
var sub1 = str.substr(maxlength, str.length-maxlength)
str = str.replace(sub1, "...");
};
return str;
}
console.log(truncate("hello, this is hunger valley,", 10) === "hello, thi...");
console.log(truncate("hello world", 20) === "hello world");

数学函数

1.写一个函数limit2,保留数字小数点后两位,四舍五入, 如: (**)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
function limit2 (num) {
var num1 = num*100
if(num1 >= 0){
num1 = Math.round(num1)
}else{
num1 = -Math.round(Math.abs(num1));
}
num = num1/100;
console.log(num);
return num;
}
var num1 = 3.456
limit2( num1 ); //3.46
limit2( 2.42 ); //2.42

2.写一个函数,获取从min到max之间的随机数,包括min不包括max (*

1
2
3
4
5
function ranAmong (min,max) {
return min+Math.random()*(max-min);
}
console.log(ranAmong(4,15));
console.log(ranAmong(14,21));

3.写一个函数,获取从min都max之间的随机整数,包括min包括max (*

1
2
3
4
5
function ranAmong (min,max) {
return Math.round(min+Math.random()*(max-min));
}
console.log(ranAmong(4,15));
console.log(ranAmong(14,21))

4.写一个函数,获取一个随机数组,数组中元素为长度为len,最小值为min,最大值为max(包括)的随机数 (*

1
2
3
4
5
6
7
8
9
function ranAmong (min,max,len) {
var arr = [];
for (var i = 0; i < len; i++) {
arr.push(Math.round(min+Math.random()*(max-min)));
};
return arr;
}
console.log(ranAmong(2,17,5));
console.log(ranAmong(12,14,3));
文章目录
  1. 1. 问答
  2. 2. 代码题
    1. 2.1. 数组
    2. 2.2. 2.使用数组拼接出如下字符串 (*)
    3. 2.3. 3.写一个find函数,实现下面的功能 (*)
    4. 2.4. 4.写一个函数filterNumeric,实现如下功能 (**)
    5. 2.5. 5.对象obj有个className属性,里面的值为的是空格分割的字符串(和html元素的class特性类似),写addClass、removeClass函数,有如下功能:(**)
    6. 2.6. 6.写一个camelize函数,把my-short-string形式的字符串转化成myShortString形式的字符串,如 (*)
    7. 2.7. 7.如下代码输出什么?为什么? (*)
    8. 2.8. 8.写一个函数filterNumericInPlace,过滤数组中的数字,删除非数字 (**)
    9. 2.9. 9.写一个ageSort函数实现如下功能 (*)
    10. 2.10. 10.写一个filter(arr, func) 函数用于过滤数组,接受两个参数,第一个是要处理的数组,第二个参数是回调函数(回调函数遍历接受每一个数组元素,当函数返回true时保留该元素,否则删除该元素)。实现如下功能: (**)
  3. 3. 字符串
    1. 3.1. 1.写一个 ucFirst函数,返回第一个字母为大写的字符 (*)
    2. 3.2. 2.写一个函数truncate(str, maxlength), 如果str的长度大于maxlength,会把str截断到maxlength长,并加上…,如 (**)
  4. 4. 数学函数
    1. 4.1. 1.写一个函数limit2,保留数字小数点后两位,四舍五入, 如: (**)
    2. 4.2. 2.写一个函数,获取从min到max之间的随机数,包括min不包括max (*)
    3. 4.3. 3.写一个函数,获取从min都max之间的随机整数,包括min包括max (*)
    4. 4.4. 4.写一个函数,获取一个随机数组,数组中元素为长度为len,最小值为min,最大值为max(包括)的随机数 (*)
,