牛客前端刷题---错题笔记(一)
1.分隔符
code:
<script type="text/javascript">
function _comma(number) {
// 补全代码
let reg = /(d)(?=(?:d{3})+$)/g;
let str = ""+number;
return str.replace(reg, $1,);
}
</script>
/*考察正则表达式，基本思路是从末尾开始每三位数字前加一个 ,
一开始我写的是 /(?!^)(?=(?:d{3})+$)/g 但还是报错了，
后来我发现这个表达式在number是正数的情况下是没问题的，
但是如果是负数就有问题了，例如：-123 在替换之后就变成 -,123 */
2. 无重复数组
code:
<script>
const _getUniqueNums = (start,end,n) => {
// 补全代码
let arr = [];
while(arr.length<n)
{
let num = Math.floor(Math.random()*(end-1)+start);
if(arr.indexOf(num) === -1) arr.push(num);
}
return arr;
}
</script>
/*考察了取随机数的方法，本来我是用的for循环，
但在有重复数据的情况下，因为重复数据不会被加入到数组中，
所以这个时候的数组长度不等于n，要用while循环一直到他放满为止 */
/*
Math.random()*m //0~m
Math.random()*m+n //n~m+n
Math.floor(Math.random()*(m+1)) //0~m
Math.floor(Math.random()*m)+1 //1~m
Math.floor(Math.random()*(m-n+1))+n //n~m
*/
3. 数组排序
code:
<body>
<button class=up>销量升序</button>
<button class=down>销量降序</button>
<ul></ul>
<script>
var cups = [
{ type: 1, price: 100, color: black, sales: 3000, name: 牛客logo马克杯 },
{ type: 2, price: 40, color: blue, sales: 1000, name: 无盖星空杯 },
{ type: 4, price: 60, color: green, sales: 200, name: 老式茶杯 },
{ type: 3, price: 50, color: green, sales: 600, name: 欧式印花杯 }
]
var ul = document.querySelector(ul);
var upbtn = document.querySelector(.up);
var downbtn = document.querySelector(.down);
// 补全代码
const List = arr => {
let str = "";
arr.forEach(element => {
str += `<li>${element.name}</li>`
})
ul.innerHTML = str;
}
upbtn.onclick = function() {
let upArr = cups.sort((a, b) =>{
return a.sales - b.sales;
})
List(upArr);
}
downbtn.onclick = function() {
let downArr = cups.sort((a, b) =>{
return b.sales - a.sales;
})
List(downArr);
}
</script>
</body>
/*
注意上面sort对对象数组的用法
模板字符串中带标签的使用
forEach的使用
*/
4. 列表动态渲染
code:
<script>
var people = [
{ name: 牛油1号, id: 1, age: 20 },
{ name: 牛油2号, id: 2, age: 21 },
{ name: 牛油3号, id: 3, age: 19 },
]
var ul = document.querySelector(ul);
// 补全代码
let str = ;
people.forEach((item) => {
str += `<li>${item.name} ${item.age}岁</li>`;
})
ul.innerHTML = str;
</script>
/*
还是forEach和模板字符串的问题
*/
5. 参数解析器
code:
<script>
const _getParams = (url) => {
// 补全代码
let arr = url.split(?)[1].split(&);
let Url = {};
arr.map((item) => {
return Url[item.split(=)[0]] = item.split(=)[1];
})
return Url;
}
</script>
/*
split的用法
对象的赋值方法
*/
总结
主要的问题出在模板字符串的使用不熟练，
对对象数组的使用不熟练，
当sort传入复杂函数时不熟练，
数组遍历方法不熟练