js牛客网编程练习汇总(一)

1、要求在页面上渲染出一个直角三角形,三角形换行要求使用"br"实现。三角形如下:
*
**
***

            var triangle = document.querySelector('.triangle');
            // 补全代码
            var str = ''
            for (var i = 1; i < 4; i++) {
                  for (var j = 0; j < i; j++) {
                        str += '*'
                  }
                  str += '<br />'
            }
            triangle.innerHTML = str

2、要求以字符串的形式返回文件名扩展名,文件名参数为"filename"。

            const _getExFilename = (filename) => {
                  // 补全代码
                  var arr = filename.split('.')
                  var name = arr[arr.length - 1]
                  return '.' + name
            }
            console.log(_getExFilename('test.txt'))

 3、要求返回参数数字的千分位分隔符字符串。

            var str = ''
            function _comma(number) {
                  // 补全代码
                  if (parseInt(number / 1000)) {
                        str = ',' + number % 1000 + str
                        _comma(parseInt(number / 1000))
                  } else {
                        str = number % 1000 + str
                  }
                  return str
            }
            console.log(_comma(12522267300))

 4、要求返回一个长度为参数值并且每一项值都为参数值的数组。

注意:1. 请勿直接使用for/while

            const _createArray = (number) => {
                  return Array(number).fill(number)
            }
            console.log(_createArray(12))

知识点:数组的 fill() 方法用于将一个固定值替换数组的元素。 

5、该函数接收两个参数分别为旧版本、新版本,当新版本高于旧版本时表明需要更新,返回true,否则返回false。

注意:1. 版本号格式均为"X.X.X"

           2. X∈[0,9]

           3. 当两个版本号相同时,不需要更新

            const _shouldUpdate = (oldVersion, newVersion) => {
                  // 补全代码
                  var oldV = oldVersion.split('.')
                  var newV = newVersion.split('.')
                  for (var l = oldV.length - 1, i = 0; i < l; i++) {
                        console.log(Number(oldV[i]) ,Number(newV[i]))
                        if (Number(oldV[i]) > Number(newV[i])) {
                              return false
                        } else if (Number(oldV[i]) < Number(newV[i])){
                              return true
                        }
                  }
            }     

6、请补全JavaScript代码,实现一个函数,要求如下:

        1. 根据输入的数字范围[start,end]和随机数个数"n"生成随机数

        2. 生成的随机数存储到数组中,返回该数组

        3. 返回的数组不能有相同元素

        注意:

        1. 不需要考虑"n"大于数字范围的情况

        const _getUniqueNums = (start, end, n) => {
            // 补全代码
            // new set可以创建一个没有重复元素的数组
            const arr = new Set()
            while (arr.size < n) {
                arr.add(parseInt(Math.random() * (end - start + 1) + start))
            }

            return [...arr];
        }
        console.log(_getUniqueNums(3, 10, 4))

知识点:ES6 提供了新的数据结构 Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。Set 本身是一个构造函数,用来生成 Set 数据结构。

 7、根据预设代码中的数组,实现以下功能:

        1. 列表只展示数组中的name属性
        2. 实现点击"销量升序"按钮,列表内容按照销量升序重新渲染
        3. 实现点击"销量降序"按钮,列表内容按照销量降序重新渲染
注意:
        1. 必须使用DOM0级标准事件(onclick)

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
</head>

<body>
    <button class='up' onclick="upp">销量升序</button>
    <button class='down' onclick="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');
        // 补全代码
        /**
         * 请补全JavaScript代码,根据预设代码中的数组,实现以下功能:
        1. 列表只展示数组中的name属性
        2. 实现点击"销量升序"按钮,列表内容按照销量升序重新渲染
        3. 实现点击"销量降序"按钮,列表内容按照销量降序重新渲染
        注意:
        1. 必须使用DOM0级标准事件(onclick)
        */
        downbtn.onclick = function () {
            cups.sort((x, y) => {
                return y.sales - x.sales
            })
            // 等价于 ul.innerHTML = '' 
            while (ul.hasChildNodes()) {
                ul.removeChild(ul.firstChild)
            }
            cups.map((item) => {
                var li = document.createElement("li");
                li.innerHTML = item.name
                ul.appendChild(li)
            })
            console.log(cups)
        }
        upbtn.onclick = function () {
            cups.sort((x, y) => {
                return x.sales - y.sales
            })
            // 清空ul下的所有li元素
            while (ul.hasChildNodes()) {
                ul.removeChild(ul.firstChild)
            }
            cups.map((item) => {
                var li = document.createElement("li");
                li.innerHTML = item.name
                ul.appendChild(li)
            })
            console.log(cups)
        }
    </script>
</body>

</html>

8、要求将字符串参数URL中的参数解析并以对象的形式返回。

输入:getParams('https://nowcoder.com/online?id=1&salas=1000')

输出:{id:1, salas: 100}

           const _getParams = (url) => {
                  // 补全代码   
                  // 1、先用slice切割字符串取出问号后面的参数
                  // url.slice(url.indexOf('?')+1) --- id=1&salas=1000
                  // 2、再用split分隔参数,得到参数数组 ---['id=1', 'salas=1000']
                  // 3、循环数组
                  let splitUrl = url.slice(url.indexOf('?') + 1).split('&')
                  let paramObj = {}
                  splitUrl.map(item => {
                        // 用es6中的解构赋值,将数据变成一个对象
                        let [k, v] = item.split('=')
                        paramObj[k] = v
                  })
                  return paramObj
            }
            _getParams('https://scriptoj.com/problems?offset=100&limit=10')

9、要求将数组参数中的对象以总成绩(包括属性  "chinese"、 "math"、 "english")从高到低进行排序并返回。

            /**
             * 请补全JavaScript代码,要求将数组参数中的对象以总成绩(包括属性 "chinese"、"math"、"english")从高到低进行排序并返回。
             */
            let arr = [{
                  name: "张三",
                  chinese: 101,
                  math: 98,
                  english: 88
            }, {
                  name: "李四",
                  chinese: 104,
                  math: 98,
                  english: 88
            }, {
                  name: "王五",
                  chinese: 102,
                  math: 98,
                  english: 88
            }, {
                  name: "赵六",
                  chinese: 109,
                  math: 98,
                  english: 88
            }]
            const _rank = array => {
                  // 补全代码
                  array.sort((a, b) => {
                        var sum1 = a.chinese + a.math + a.english
                        var sum2 = b.chinese + b.math + b.english
                        // return sum1 - sum2 //升序
                        return sum2 - sum1 //降序
                  })
                  console.log(array)
                  return array
            }
            _rank(arr)

10、要求将数组参数中的多维数组扩展为一维数组并返回该数组。注意:1. 数组参数中仅包含数组类型和数字类型

            输入:[1,[2,[3,[4]]]]

            输出:[1,2,3,4]

            let array = []
            const _flatten = arr => {
                  // 补全代码
                  // 法一
                  arr.map(aa => {
                        // 不是数字类型就说明是数组,那就递归调用函数
                        if (typeof (aa) != 'number') {
                              _flatten(aa)
                        } else {
                              array.push(aa)
                        }
                  })
                  console.log(array)
                  // 法二 用some
                  while (arr.some((item) => Array.isArray(item))) {
                        arr = [].concat(...arr)
                  }
                  return array
            }
            _flatten([1, [2, [3, [4]]]])

some() 方法用于检测数组中的元素是否满足指定条件(函数提供)。

some() 方法会依次执行数组的每个元素:

  • 如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。
  • 如果没有满足条件的元素,则返回false。

11、请补全JavaScript代码,该函数接受两个参数分别为字符串、子字符串,要求返回子字符串在字符串中出现的频次。

            const _searchStrIndexOf = (str, target) => {
                  // 补全代码
                  // 使用split分割数组,有n个target返回的列表就会有n+1个元素
                  // 最后将数组长度减去1就得到出现的频次了
                  let arr = str.split(target)
                  return arr.length - 1
            }
            _searchStrIndexOf('sdffgfdfdgfdw', 'fd')

12、请补全JavaScript代码,要求以Boolean的形式返回参数数组是否为斐波那契数列。在数学上,斐波那契数列以如下方法定义:

 F(0)=0,F(1)=1, F(n)=F(n - 1)+F(n - 2)(n ≥ 2,n ∈ N)

 注意: 1. [0,1,1]为最短有效斐波那契数列

            const _isFibonacci = array => {
                  // 补全代码   
                  // 1、先判断数组长度,小于3可以直接不用考虑了
                  // 2、用循环判断数组的前一项和后一项相加是否等于第三项,不等于则直接退出
                  // 3、当for循环执行完毕没有退出,就说明数组是斐波那契数列,返回true即可
                  if (array.length < 3) return false
                  for (var i = 0; i < array.length - 2; i++) {
                        if (array[i] + array[i + 1] != array[i + 2]) {
                              return false
                        }
                  }
                  return true
            }
            _isFibonacci([0, 1, 1, 2, 3, 5, 8, 13, 222]) //false

猜你喜欢

转载自blog.csdn.net/qq_41579104/article/details/129031076
今日推荐