1、直角三角形
请补全JavaScript代码,要求在页面上渲染出一个直角三角形,三角形换行要求使用"br"实现。
var triangle = document.querySelector('.triangle');
var str = '';
for (let i = 0; i < 3; i++){
for (let j = 0; j <= i; j++){
str += '*';
}
str += '<br>';
}
triangle.innerHTML = str;
2、文件扩展名
要求以字符串的形式返回文件名扩展名,文件名参数为"filename"。
const _getExFilename = (filename) => {
let index =filename.lastIndexOf('.');
return filename.slice(0,index)&&index!=-1?filename.slice(index):''
}
3、分隔符
要求返回参数数字的千分位分隔符字符串
输入:_comma(12300) 输出:‘12,300’
function _comma(number) {
let arr=Math.abs(number).toString().split('').reverse()
let i=3
while(i<arr.length){
arr.splice(i,0,',')
i+=4
}
let str=arr.reverse().join('')
return number>=0?str:'-'+str
}
4、单项绑定
请补全JavaScript代码,要求每当id为"input"的输入框值发生改变时触发id为"span"的标签内容同步改变。
注意:必须使用DOM0级标准事件(onchange)
<body>
<input id="input" type="text" onchange="changeInput()" />
<span id="span"></span>
<script type="text/javascript">
function changeInput() {
span.innerHTML = input.value;
}
</script>
</body>
5、创建数组
请补全JavaScript代码,要求返回一个长度为参数值并且每一项值都为参数值的数组。
注意:请勿直接使用for/while
const _createArray = (number) => {
return Array(number).fill(number)
}
6、判断版本
请补全JavaScript代码,该函数接收两个参数分别为旧版本、新版本,当新版本高于旧版本时表明需要更新,返回true,否则返回false。
注意:
- 版本号格式均为"X.X.X"
- X∈[0,9]
- 当两个版本号相同时,不需要更新
const _shouldUpdate = (oldVersion, newVersion) => {
// 补全代码
let newArr = newVersion.split(".")
let oldArr = oldVersion.split(".")
let flag = false
for(let i=0;i<newArr.length;i++){
document.body.innerText+=(Number(newArr[i])>Number(oldArr[i]))
if(Number(newArr[i])>Number(oldArr[i])){
flag = true
}
}
return flag
}
_shouldUpdate('9.0.1','9.1.0');
7、无重复数组
请补全JavaScript代码,实现一个函数,要求如下:
- 根据输入的数字范围[start,end]和随机数个数"n"生成随机数
- 生成的随机数存储到数组中,返回该数组
- 返回的数组不能有相同元素
- 注意: 不需要考虑"n"大于数字范围的情况
const _getUniqueNums = (start,end,n) => {
let arr = [];
while(arr.length<n){
let v =Math.floor(Math.random()*(end-1)+start)
if(arr.indexOf(v)===-1){
arr.push(v)
}
}
return arr
}
8、数组排序
请补全JavaScript代码,根据预设代码中的数组,实现以下功能
- 列表只展示数组中的name属性
- 实现点击"销量升序"按钮,列表内容按照销量升序重新渲染
- 实现点击"销量降序"按钮,列表内容按照销量降序重新渲染
注意: 必须使用DOM0级标准事件(onclick)
for(let i =0;i<cups.length;i++){
let li=document.createElement('li')
li.innerHTML=cups[i].name
ul.append(li)
}
var lis=document.querySelectorAll('li')
upbtn.onclick=function (){
cups.sort((a,b)=>a.sales-b.sales)
for (let i = 0; i < cups.length; i++) {
lis[i].innerHTML = cups[i].name;
}
}
downbtn.onclick=function (){
cups.sort((a,b)=>b.sales-a.sales)
for (let i = 0; i < cups.length; i++) {
lis[i].innerHTML = cups[i].name;
}
}
9、新数组
该函数接受两个参数分别为数组、索引值,要求在不改变原数组的情况下返回删除了索引项的新数组。
const _delete = (array,index) => {}
return array.filter((item,idx)=> index != idx)
}
10、计数器
请补全JavaScript代码,要求每次调用函数"closure"时会返回一个新计数器。每当调用某个计数器时会返回一个数字且该数字会累加1。
- 初次调用返回值为1
- 每个计数器所统计的数字是独立的
const closure = () => {
let a = 0;
return () => {
a++;
return a;
}
}
11、列表动态渲染
将预设代码中的"people"数组渲染在页面中。实现下面的列表:
- 牛油1号 20岁
- 牛油2号 21岁
- 牛油3号 19岁
let list = '';
people.forEach(item=>{
list += `<li>${item.name} ${item.age}岁</li>`
})
ul.innerHTML = list;
12、模板字符串
- 根据已有的person对象的注册时间求出距离当前时间的天数(天数向下取整)。
- 将获得的天数和person数据拼接成字符串,作为h2标签的内容。
注意:使用模板字符串进行字符串拼接,字符串最终内容如:尊贵的牛客网2级用户小丽您好,您已经注册牛客网3天啦~
let rDate = new Date(person.registTime).getTime();
let rTime = Math.floor((new Date().getTime()-rDate)/(1000*60*60*24))
h2.innerText=`尊贵的牛客网${person.level}级用户${person.name}您好,您已经注册牛客网${rTime}天啦~`;
13、类继承
请补全JavaScript代码,完成类的继承。要求如下:
- "Chinese"类继承于"Human"类
- “Human"类实现一个函数"getName”,返回该实例的"name"属性
- “Chinese"类构造函数有两个参数,分别为"name”、“age”
- “Chinese"类实现一个函数"getAge”,返回该实例的"age"属性
class Human {
constructor(name) {
this.name = name
this.kingdom = 'animal'
this.color = ['yellow', 'white', 'brown', 'black']
}
getName(){
return this.name;
}
}
class Chinese extends Human {
constructor(name,age){
super(name);
this.age = age;
}
getAge(){
return this.age
}
}
14、参数解析器
要求将字符串参数URL中的参数解析并以对象的形式返回。
var obj = {}
var arr = url.split('?')[1].split('&')
for (let i = 0;i < arr.length;i++){
//id=1 , salas=1000
let temp = arr[i].split('=')
//id,1 salas,1000
obj[temp[0]] = temp[1]
}
return obj
15、生成页码
要求根据参数动态生成"li"标签页码并插入"ul"标签下。要求如下:
- "allItem"为总数据项个数,"pageItem"为每页的数据项个数
- "li"标签内容为当前页码数,页码从1开始
let num=Math.ceil(allItem/pageItem);
for (let index = 0; index < num; index++) {
let li=document.createElement('li')
li.innerHTML=String(index+1);
ul.appendChild(li)
}
16、总成绩排名
要求将数组参数中的对象以总成绩(包括属性"chinese"、“math”、“english”)从高到低进行排序并返回。
array.sort((a,b)=>{
let left = a.chinese+a.math+a.english;
let right = b.chinese+b.math+b.english;
return right-left;
})
return array;
17、子字符串的频次
该函数接受两个参数分别为字符串、子字符串,要求返回子字符串在字符串中出现的频次。
var a = str.split(target)
return a.length-1
18、继承
请补全JavaScript代码,实现以下功能:
- 给"Human"构造函数的原型对象添加"getName"方法,返回当前实例"name"属性
- 将"Chinese"构造函数继承于"Human"构造函数
- 给"Chinese"构造函数的原型对象添加"getAge"方法,返回当前实例"age"属性
Human.prototype.getName = function (){
return this.name
}
Chinese.prototype = new Human();
Chinese.prototype.constructor = Chinese;
Chinese.prototype.getAge = function (){
return this.age;
}
19、判断斐波那契数组
要求以Boolean的形式返回参数数组是否为斐波那契数列。在数学上,斐波那契数列以如下方法定义:F(0)=0,F(1)=1, F(n)=F(n - 1)+F(n - 2)(n ≥ 2,n ∈ N)
注意: [0,1,1]为最短有效斐波那契数列
const _isFibonacci = array => {
if(array.length<3){
return false
}
else{
for(let i=0;i<array.length;i++){
if(i>1&&array[i]!=array[i-1]+array[i-2]){
return false
}
}
}
return true
}
20、数组扁平化
要求将数组参数中的多维数组扩展为一维数组并返回该数组。
注意:数组参数中仅包含数组类型和数字类型
let res = []
const _flatten = arr => {
arr.forEach(item => {
if (Array.isArray(item)) {
_flatten(item)
} else {
res.push(item)
}
})
return res
}