2016-05-13

JavaScript数组知识综合运用

问答

数组方法里push、pop、shift、unshift、join、split分别是什么作用。（*）

push在数组末尾添加一个元素
pop从数组末尾删除一个元素
shift把数组的第一个元素删除掉
unshift在数组的头部添加一个元素
join() 将数组里面的元素以一定的方式：()内参数，连接成字符串
split() 是字符串方法，将一个字符串以()里面的内容为分割点分解成数组

splice(start[, deleteCount][, values]) 以第一个参数为起点，第二个参数为位移作为一个，将第三个参数替换这个范围。第二个参数省略则为插入操作，第三个参数省略为删除操作，均改变原数组

代码题

数组

1、用 splice 实现 push、pop、shift、unshift方法（*）

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.使用数组拼接出如下字符串（*）

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函数，实现下面的功能（*）


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，实现如下功能（**）

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函数，有如下功能：(**)

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形式的字符串，如 (*)

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.如下代码输出什么？为什么? (*)

	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，过滤数组中的数字，删除非数字 (**)

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函数实现如下功能（*）

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时保留该元素，否则删除该元素)。实现如下功能：（**）

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函数，返回第一个字母为大写的字符（*）

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长，并加上…，如（**）

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，保留数字小数点后两位，四舍五入，如: （**）

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 （*）

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 （*）

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(包括)的随机数（*）

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));

本文标题:JavaScript数组知识综合运用

文章作者:findmoon

发布时间:2016年05月13日 - 17时23分

最后更新:2016年05月18日 - 10时31分

原始链接://findmoon.github.io/index.html/2016/05/13/JavaScript数组知识综合运用/

许可协议: "署名-非商用-相同方式共享 3.0" 转载请保留原文链接及作者。

问答

代码题

数组

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

3.写一个find函数，实现下面的功能 （*）

4.写一个函数filterNumeric，实现如下功能 （**）