面试题之常见 JS 代码笔试题

本文展示了JavaScript编程中的一些常见技巧,包括随机数生成、数组排序、字符串操作、日期格式化、对象深拷贝以及数组去重等。通过实例解析了如何实现驼峰命名、URL参数解析、字符串前后空格清除等功能,旨在提升JavaScript编程能力。
摘要由CSDN通过智能技术生成

1. 用 js 实现随机选取 10 –100 之间的 10 个数字,存入一个数组并排序

	var arr = [2, 3, 4, 1, 5]
			console.log(arr.sort());

			console.log(parseInt(Math.random() * (100 - 10 - 1) + (10 + 1)));

			function randomNub(arr, num, min, max) {
				// 判断数组长度是否为10 为10退出
				if (arr.length === num) return arr.sort()
				// 获取输入的最大值与最小值的随机数 不包括min值与max值
				let Random = parseInt(Math.random() * (max - min - 1) + (min + 1))
				// 判断数组中是否有这个随机数 有则不添加 
				if (!arr.some(it => it === Random)) arr.push(Random)
				// 调用函数 往数组里继续加值
				randomNub(arr, num, min, max)
			}
			const Arr = []
			randomNub(Arr, 10, 10, 100)
			console.log(Arr)

2. 已知数组 var stringArray = [“This”,“is”,“Baidu”,“Campus”],Alert 出"This is Baidu Campus"

<script>
var stringArray = ["This", "is", "Baidu", "Campus"]
// join:将数组元素转换为字符串(以引号中间的内容作切割),引号中间可以写空格
alert(stringArray.join(' ')) </script

3. 已知有字符串 foo=”get-element-by-id”,写一个 function 将其转化成驼峰表示法”getElementById”

	function toArr() {
			var carfoo = "get-element-by-id"

			// 1. split('-'): 将字符串通过"-"符号切割成数组,得到['get', 'element', 'by', 'id']
			var arr = carfoo.split('-')
			console.log('arr', arr);

			for (var i = 1; i < arr.length; i++) {
				// 2.charAt(下标): 拿到字符串的第一个字符,分别的到 e b i
				// 3.toUpperCase(): 将字符转化成大写,分别得到 E B I
				// 4.substr(下标, 数量): 拿到字符串第一个字母后面的字符
				// 5.通过 "+" 符号将后续的字符进行拼接
				// 6.赋值给原数组元素
				arr[i] = arr[i].charAt(0).toUpperCase() + arr[i].substr(1, arr[i].length - 1)
				console.log(1, arr[i].charAt(0).toUpperCase());
				console.log(2, arr[i].substr(1, arr[i].length - 1))

			}

			// 7.join(''): 转化成字符串,得到 getElementById
			var newCarfoo = arr.join('')
			console.log(3, newCarfoo);
		}
		toArr()

4. 有 这 样 一 个 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}

		// 方法一:(url 地址为窗口地址)
		var search = location.search; // location.search:url 里从?开始到最后的所有元素(a = 1 & b = 2 & c =& d =xxx & e)
		var obj = {};
		if (search != 0) { // 判断
			var splits = search.slice("1").split("&"); // 将获取的元素以&切割,
			for (var i = 0; i < splits.length; i++) { // 循环,将每个元素以'='切割
				var arr = splits[i].split("=");
				obj[arr[0]] = arr[1];
			}
		}
		console.log(obj)

		// 方法二: (它是一个自定义好的字符串,不是当前窗口的 url)
		var str = "http:/\/item.taobao.com/item.htm?name=xiaoming&sex=boy&age=18&weight=70kg&e"
		function serilizeUrl(url) {
			var result = {};
			url = url.split("?")[1]; // 将字符串以?切割
			var map = url.split("&"); // 以 & 切割
			for (var i = 0, len = map.length; i < len; i++) {
				result[map[i].split("=")[0]] = map[i].split("=")[1];
			}
			return result;
		}
		console.log(serilizeUrl(str))

5. 输出今天的日期,以 YYYY-MM-DD 的方式,比如今天是 2014 年 9 月 26 日,则输出 2014-09-26

			var d = new Date();

			// 获取年,getFullYear()返回 4 位的数字
			var year = d.getFullYear();
			console.log('year', year);
			// 获取月,月份比较特殊,0 是 1 月,11 是 12 月
			var month = d.getMonth() + 1;
			console.log('month', month);
			// 变成两位
			month = month < 10 ? '0' + month : month;
			// 获取日
			var day = d.getDate();
			console.log('day', day);
			day = day < 10 ? '0' + day : day;
			// alert(year + '-' + month + '-' + day);
			console.log(year + '-' + month + '-' + day);

6.  把两个数组合并,并删除第二个元素。

	var array1 = ['a', 'b', 'c'];
			var bArray = ['d', 'e', 'f'];
			var cArray = array1.concat(bArray);
			console.log(array1);
			console.log(bArray);

			console.log(cArray);
			// 数组的concat方法合并多个数组,不改变原数组

			var qwe = cArray.splice(1, 1)
			console.log(cArray);

			// splice方法不传入第三个参数(要添加的值)时,则起到删除作用: 这里是从索引为1处开始,删除一个元素

7. 写一个 function,清除字符串前后的空格。(兼容所有浏览器)

	var str = ' qwere err '
			console.log(str);
			var a = str.trim()
			console.log(a);

			// 使用自带接口 trim(),考虑兼容性: 
			if (!String.prototype.trim) {
				String.prototype.trim = function () {
					return this.replace(/^\s+/, "").replace(/\s+$/, "");
					//正则: \s 匹配空格, + 匹配一次或多次^ 字符串开头, $ 字符串结尾; 数组的replace方法两个参数,将前一个参数替换为后一个参数
				}
			}

8.  判断一个字符串中出现次数最多的字符,统计这个次数

var str = 'asdfssaaasasasasaa'
		var obj = {}
		for (let i = 0; i < str.length; i++) {
			// [str.charAt(i)] 是根据index返回指定的字符
			// 1.如果obj对象中没有这个属性,则添加这个属性,值为 1

			if (!obj[str.charAt(i)]) {
				obj[str.charAt(i)] = 1
			} else {
				// 2.如果obj对象中有这个属性,则让他的值++
				obj[str.charAt(i)]++
			}
			// console.log(obj);
		}
		// 3.打印obj对象 得出每个字符在str中出现的次数 显示为键值对的形式
		console.log(obj)
		//  声明两个变量用来统计出现最多的字符和出现的次数
		var iMax = 0
		var iIndex = ''
		console.log(obj['a']);
		for (var i in obj) {
			console.log(i);
			// 因为 获取到的i是字符串,所以需要通过 obj['a']  获取值的方式
			console.log(obj[i]);
			// 循环这个对象,如果本次循环的属性值大于iMax 则把它的值赋值给iMax
			if (obj[i] > iMax) {
				iMax = obj[i]
				iIndex = i
			}
		}
		console.log('出现次数最多的是:' + iIndex + '共出现' + iMax + '次')

9. 将数字 12345678 转化成 RMB 形式 如: 12,345,678

function format(num) {
			// 将数字转换为字符串模式 
			const str = num.toString()
			console.log('转换为字符串', str);
			// 封装一个字符串翻转函数 
			function revStr(str) { return str.split('').reverse().join('') }
			// 保存翻转后的字符串 
			const newStr = revStr(str)
			console.log('翻转后的字符串', newStr);

			// 定义一个变量用来保存处理后的结果 let res = '' 
			// 循环中的i必须是1,否则if条件执行错误 
			let res = ''
			for (let i = 1; i <= newStr.length; i++) {
				res = res + newStr[i - 1]
				console.log(res);
				// i !== newStr.length 不写时当数字长度是3的倍数时,还会在加一个逗号,造成最前面出现一个逗号
				if (i % 3 === 0 && i !== newStr.length) { res = res + ',' }
			}
			// 将循环后的结果翻转后返回 
			return revStr(res)
		}
		const rmb = format(12345678)
		console.log(rmb);

10. JavaScript 中如何对一个对象进行深度 clone

// 	方法一:

		function clone(obj) {
			// 判断数据类型是不是对象
			if (typeof obj === 'object') {
				// 因为数组也属于对象,细分传入的值是不是数组
				if (obj instanceof Array) {
					const result = []
					for (let i = 0; i < obj.length; i++) {
						// 递归调用
						result[i] = clone(obj[i])
					}
					return result
				} else {
					const result = {}
					for (const i in obj) {
						// 递归调用
						result[i] = clone(obj[i])
					}
					return result
				}
			} else {
				return obj
			}
		}
		const obj1 = [12, { a: 11, b: 22 }, 5]
		const obj2 = clone(obj1)
		obj2[1].a += 5
		console.log(obj1, obj2)


		// 方法二:
		function cloneObject(obj) {
			console.log(!obj)
			// 如果obj有值,就会去判断obj的类型是不是对象,不满足条件直接返回值
			if (!obj || typeof obj !== 'object') {
				return obj
			}
			// 判断obj是不是数组,从而定义一个初识变量用于保存值
			const o = obj.constructor === Array ? [] : {}
			// 循环obj中的每一个key
			for (const i in obj) {
				// 判断obj[i]的值是不是对象,如果是执行递归
				o[i] = typeof obj[i] === 'object' ? cloneObject(obj[i]) : obj[i]
			}
			return o
		}
		const obj3 = [12, { a: 11, b: 22 }, 5]
		const obj4 = cloneObject(obj3)
		obj2[1].a += 5
		console.log(obj3, obj4)

11. js 数组去重,能用几种方法实现


		//方法1:使用 es6 set 方法[...new Set(arr)]
		let arr1 = [0, 0, 5, 5, 9, 8, 1, 5, 4]
		let unique1 = [...new Set(arr1)]
		// 利用set里面元素不能重复的特性进行去重
		console.log(unique1) // [0,5,9,8,1,4]



		//  方法2: 利用indexOf()查找是否有相同元素
		let arr2 = [0, 0, 5, 5, 9, 8, 1, 5, 4]
		const unique2 = []
		for (var key of arr2) {
			// 如果在数组中没找到该元素,则会返回-1
			unique2.indexOf(key) === -1 && unique2.push(key)
		}
		console.log(unique2); // [0,5,9,8,1,4]



		// 方法3: 利用filter过滤数组
		let arr3 = [0, 0, 5, 5, 9, 8, 1, 5, 4]
		let unique3 = arr3.filter((it, index) => {
			// 如果结果为true,则会返回该元素
			return arr3.indexOf(it) === index
		})
		console.log(unique3); // [0, 5, 9, 8, 1, 4]



		// 方法4:利用 Map 数据结构去重
		let arr4 = [0, 0, 5, 5, 9, 8, 1, 5, 4]
		// Map 对象保存键值对,并且能够记住键的原始插入顺序。任何值(对象或者原始值) 都可以作为一个键或一个值。
		let seen = new Map();
		const unique4 = arr4.filter((item) => {
			// 方法has() 返回一个bool值,用来表明map 中是否存在指定元素.
			// set() 方法为 Map 对象添加或更新一个指定了键(key)和值(value)的(新)键值对。
			return !seen.has(item) && seen.set(item, 1);
		});
		console.log(unique4); // [0, 5, 9, 8, 1, 4]



		// 方法5: 利用循环和includes
		let arr5 = [0, 0, 5, 5, 9, 8, 1, 5, 4]
		let unique5 = []
		for (var key of arr5) {
			!unique5.includes(key) && unique5.push(key)
		}
		console.log(unique5);



		// 方法6: 双重for循环和splice

		let arr6 = [0, 0, 5, 5, 9, 8, 1, 5, 4]
		for (var i = 0; i < arr6.length; i++) {
			for (var j = i + 1; j < arr6.length; j++) {
				if (arr6[i] == arr[j]) {
					//第一个等同于第二个,splice 方法删除第二个
					arr6.splice(j, 1); j--;
				}
			}
		}
		console.log(arr6); // [0, 5, 9, 8, 1, 4]

  • 0
    点赞
  • 23
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值