1、绘制直角三角形
补全JavaScript代码，要求在页面上渲染出一个直角三角形，三角形换行要求使用"br"实现。三角形如下：
解：
<script> var triangle = document.querySelector('.triangle'); // 补全代码 let htm = ''; for (let i = 1; i <= 3; i++) { for (let j = 0; j < i; j++) { htm += '*'; } htm += '<br>'; } triangle.innerHTML = htm; </script>
复制代码
2、获取文件扩展名
补全JavaScript代码，要求以字符串的形式返回文件名扩展名，文件名参数为"filename"。
注意：返回的扩展名格式为.扩展
解：
<script> const _getExFilename = (filename) => { // 补全代码 const arr = filename.split(".") return '.' + arr[arr.length - 1] } </script>
复制代码
将字符串通过split方法以.分割成数组，数组最后一位既是扩展名称
3、添加分隔符
补全JavaScript代码，要求返回参数数字的千分位分隔符字符串。
输入：_comma(12300)输出：'12,300'
复制代码
解：
<script type="text/javascript"> function _comma(number) { // 补全代码 if (number < 1000) { return number + ''; }; return _comma(parseInt(number / 1000)) + ',' + number % 1000 } </script>
复制代码
举个例子：
当number为 14360 时，number / 1000为 14.36，parseInt(number / 1000)为 14，_comma(parseInt(number / 1000))为'14'， number % 1000为 360，最终return的结果为'14,360'
4、单向绑定
补全JavaScript代码，要求每当id为"input"的输入框值发生改变时触发id为"span"的标签内容同步改变。注意： 必须使用DOM0级标准事件（onchange）
解：
<body> <input id="input" type="text" /> <span id="span"></span>
<script type="text/javascript"> // 补全代码 const inp=document.getElementById('input'); const spa=document.getElementById('span'); inp.onchange=()=>{ spa.innerText=inp.value } </script> </body>
复制代码
5、快熟创建指定长度数组
请补全JavaScript代码，要求返回一个长度为参数值并且每一项值都为参数值的数组。注意：请勿直接使用for/while
解：
<script type="text/javascript"> const _createArray = (number) => { // 补全代码 return new Array(number).fill(number) } </script>
复制代码
arr.fill(value, start, end) // - `value` 用来填充数组元素的值。 // - `start` 可选 起始索引，默认值为 0。 // - `end` 可选 终止索引，默认值为 this.length。
复制代码
6、判断版本
请补全JavaScript代码，该函数接收两个参数分别为旧版本、新版本，当新版本高于旧版本时表明需要更新，返回true，否则返回false。注意：
版本号格式均为"X.X.X"
X∈[0,9]
当两个版本号相同时，不需要更新
解：
<script type="text/javascript"> const _shouldUpdate = (oldVersion, newVersion) => { // 补全代码 const oldNum=oldVersion.split('.').join('')+0; const newNum=newVersion.split('.').join('')+0; return newNum>oldNum } </script>
复制代码
版本号格式均为"X.X.X"，且x为 0-9 的数字，直接可以对其通过split('.')分割成数组后为[x,x,x]，再进一步使用join('')将数组转换成字符串为'xxx'，加个 0 转换成数字number类型的，之后进行比较即可。
7、无重复数组
请补全JavaScript代码，实现一个函数，要求如下：
根据输入的数字范围[start,end]和随机数个数"n"生成随机数
生成的随机数存储到数组中，返回该数组
返回的数组不能有相同元素注意：
不需要考虑"n"大于数字范围的情况
输入：getUniqueNums(2,10,4)输出：[4,6,2,8]
复制代码
解：
<script> const _getUniqueNums = (start,end,n) => { // 补全代码 const set=new Set(); while(set.size<n){ const num=parseInt(Math.random()*(end-start)+start); set.add(num) }; return [...set] } </script>
复制代码
利用ES6的Set数据结构，保证其中的数据不重复，通过Set的size属性获取其元素个数与n进行判断，少于指定元素时就生成随机数，然后通过add方法向Set中添加元素，之后返回时通过解构将Set结构转换成数组。
点此查看Set详情
8、数组排序
请补全JavaScript代码，根据预设代码中的数组，实现以下功能：
列表只展示数组中的name属性
实现点击"销量升序"按钮，列表内容按照销量升序重新渲染
实现点击"销量降序"按钮，列表内容按照销量降序重新渲染注意：
必须使用DOM0级标准事件（onclick）
解：
<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'); // 补全代码 function showList(list) { let str = ''; list.forEach(item => { str += `<li>${item.name}</li>` }) ul.innerHTML = str }; showList(cups); upbtn.onclick = function () { cups.sort((next, prev) => next.sales - prev.sales); showList(cups); }; downbtn.onclick = function () { cups.sort((next, prev) => prev.sales - next.sales); showList(cups); }; </script></body>
复制代码
点此查看数组排序sort方法详情
9、新数组
请补全JavaScript代码，该函数接受两个参数分别为数组、索引值，要求在不改变原数组的情况下返回删除了索引项的新数组。
解：
<script type="text/javascript"> const _delete = (array,index) => { // 补全代码 return array.filter((_,i)=>i!==index) } </script>
复制代码
点此查看数组过滤filter方法详情
10、计数器
请补全JavaScript代码，要求每次调用函数"closure"时会返回一个新计数器。每当调用某个计数器时会返回一个数字且该数字会累加 1。注意：
初次调用返回值为 1
每个计数器所统计的数字是独立的
解：
<script type="text/javascript"> const closure = () => { // 补全代码 let num=1; return ()=>num++; }; </script>
复制代码
这题主要考试的就是JS的闭包，点击查看闭包详情
结语
这篇文章内容非常简单，主要是为了巩固自己的基础，正可谓基础不牢，地动山摇！！！
评论