js牛客网编程练习汇总
Posted suoh's Blog
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js牛客网编程练习汇总相关的知识,希望对你有一定的参考价值。
1、请补全javascript代码,要求根据下拉框选中的条件变换重新渲染列表中展示的商品,且只展示符合条件的商品。
注意:1. 必须使用DOM0级标准事件(onchange)
2. 建议使用ES6的filter方法
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body>
<select name="" id="">
<option value="0">请选择销量范围</option>
<option value="1"><100</option>
<option value="2">100~500</option>
<option value="3">>500</option>
</select>
<ul>
<li>牛客logo马克杯</li>
<li>无盖星空杯</li>
<li>老式茶杯</li>
<li>欧式印花杯</li>
</ul>
<script>
var cups = [
type: 1,
price: 100,
color: 'black',
sales: 60,
name: '牛客logo马克杯'
,
type: 2,
price: 40,
color: 'blue',
sales: 100,
name: '无盖星空杯'
,
type: 4,
price: 60,
color: 'green',
sales: 200,
name: '老式茶杯'
,
type: 3,
price: 50,
color: 'green',
sales: 600,
name: '欧式印花杯'
]
var select = document.querySelector('select');
var ul = document.querySelector('ul');
// 补全代码
/**
* 请补全JavaScript代码,要求根据下拉框选中的条件变换重新渲染列表中展示的商品,且只展示符合条件的商品。
注意:
1. 必须使用DOM0级标准事件(onchange)
2. 建议使用ES6的filter方法
*/
select.onchange = function (e)
ul.innerHTML = ''
switch (parseInt(this.value))
case 1:
var newArr = cups.filter((item) =>
return item.sales < 100
)
break
case 2:
var newArr = cups.filter((item) =>
return item.sales >= 100 && item.sales <= 500
)
break
case 3:
var newArr = cups.filter((item) =>
return item.sales > 500
)
break
showContent(newArr)
function showContent(arr)
var str = ''
arr.forEach(item =>
str += `<li>$item.name</li>`
);
ul.innerHTML = str
</script>
</body>
</html>
2、请补全JavaScript代码,要求在Number对象的原型对象上添加"_isPrime"函数,该函数判断调用的对象是否为一个质数,是则返回true,否则返回false。
<script type="text/javascript">
// 补全代码
/**
* 请补全JavaScript代码,要求在Number对象的原型对象上添加"_isPrime"函数,
* 该函数判断调用的对象是否为一个质数,是则返回true,否则返回false。
*/
// 质数:指在大于1的自然数中,除了1和它本身以外不再有其他因数的自然数。
Number.prototype._isPrime = function (num)
if (num < 2) return false
for (var i = 2; i < num; i++)
if (num % i === 0)
return false
return true
</script>
3、请补全JavaScript代码,要求以Boolean的形式返回字符串参数是否符合身份证标准。
注意:1. 无需考虑地区信息、出生日期、顺序码与校验码的验证
<script>
/**
* 请补全JavaScript代码,要求以Boolean的形式返回字符串参数是否符合身份证标准。
注意:
1. 无需考虑地区信息、出生日期、顺序码与校验码的验证
*/
// 41088219980825152X
/**
* 分析身份证分为一代和二代
* (1)一代15位,可以是15位数字(^\\d15$):\\d 数字字符等同于0-9,15代表15位
* (2)二代18位,可以是15位数字(^\\d18$):\\d 数字字符等同于0-9,18代表15位
* (3)身份证最后一位可能是''x'|'X'',(^\\d17(\\d|X|x)$
*/
const _isCard = number =>
var regx = /(^\\d15$)|(^\\d18$)|(^\\d17(\\d|X|x)$)/
return regx.test(number)
</script>
4、请补全JavaScript代码,要求以键/值对的对象形式返回参数数组。要求如下:
1. 键名的数据类型为Symbol
2. 键值为当前数组项
3. Symbol的描述为当前数组项
4. 返回普通对象
const _symbolKey = array =>
// 补全代码
let obj = new Object()
array.forEach(aa =>
obj[Symbol(aa)] = aa
);
return obj
5、请补全JavaScript代码,要求以boolean的形式返回两个Set对象参数是否一样,是则返回true,否则返回false。
<script>
/**
* 请补全JavaScript代码,
* 要求以boolean的形式返回两个Set对象参数是否一样,是则返回true,否则返回false
*/
const _isSameSet = (s1, s2) =>
// 补全代码
if (s1.size !== s2.size)
return false
return [...s1].every(i => s2.has(i))
const letters = new Set();
const letters1 = new Set();
letters.add('a');
letters.add('b');
letters.add('c');
letters1.add(0)
letters1.add('d')
letters1.add('f')
console.log(_isSameSet(letters, letters1))
</script>
知识点补充:
new Set() | 创建新的 Set 对象。 |
add() | 向 Set 添加新元素。 |
clear() | 从 Set 中删除所有元素。 |
delete() | 删除由其值指定的元素。 |
entries() | 返回 Set 对象中值的数组。 |
has() | 如果值存在则返回 true。 |
forEach() | 为每个元素调用回调。 |
keys() | 返回 Set 对象中值的数组。 |
values() | 与 keys() 相同。 |
size | 返回元素计数。 |
6、请补全JavaScript代码,完成名为"Rectangle"的矩形类。要求如下:
1. 构造函数只包含两个参数,依次为"height"、"width"
2. 设置Getter,当获取该对象的"area"属性时,返回该对象"height"与"width"属性的乘积
这里涉及到了class类的知识点,可以参考以下详细讲解文章:
ES6--class类(详解/看完必会)_class类详解_suoh's Blog的博客-CSDN博客
<script type="text/javascript">
/**
* 请补全JavaScript代码,完成名为"Rectangle"的矩形类。要求如下:
1. 构造函数只包含两个参数,依次为"height"、"width"
2. 设置Getter,当获取该对象的"area"属性时,返回该对象"height"与"width"属性的乘积
*/
class Rectangle
// 补全代码
constructor(height, width)
this.height = height
this.width = width
get area()
return this.calcArea()
calcArea()
return this.height * this.width
var area = new Rectangle(12, 12).area
console.log(area)
</script>
7、请补全代码,要求当滑动id为"range"的滑块控件时可以改变id为"rect"的矩形旋转速度。要求如下:
1. id为"rect"的矩形初始动画周期为10秒
2. id为"range"的滑块控件默认值为1、最小值为、最大值为10、滑动间隔为1
3. 当滑动滑块值为1时,矩形动画周期为10秒、当...,为...、当滑动滑块值为10时,矩形动画周期为1秒
注意:
1. 必须使用DOM0级标准事件(onchange)
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<style type="text/css">
#rect
width: 120px;
height: 100px;
background-color: black;
/*补全代码*/
animation: rect 10s linear infinite;
@keyframes rect
from
transform: rotate(0deg);
to
transform: rotate(360deg);
</style>
</head>
<body>
<!-- 补全代码 -->
<div id="rect"></div>
<input id="range" type="range" step="1" defaultValue="1" value="5" min="1" max="10" />
<script type="text/javascript">
// 补全代码
document.querySelector('#range').onchange = function ()
let speed = document.querySelector('#range').value
document.querySelector('#rect').style.animationDuration = 11 - speed + 's'
</script>
</body>
</html>
知识点:
input框的type类型为range,就是一个进度条展示,可能平时用的少,今天拓展一下
<input id="range" type="range" step="1" defaultValue="1" value="5" min="1" max="10" />
动画属性:
animation: name duration timing-function delay iteration-count direction;
animation-name 规定需要绑定到选择器的 keyframe 名称。 animation-duration 规定完成动画所花费的时间,以秒或毫秒计。 animation-timing-function 规定动画的速度曲线。
animation-delay 规定在动画开始之前的延迟。 animation-iteration-count 规定动画应该播放的次数。 animation-direction 规定是否应该轮流反向播放动画。 animation-fill-mode 规定动画在执行时间之外应用的值。 animation-play-state 规定动画是正在运行还是暂停。
8、根据题目要求,将页面中的“p”标签DOM节点保存在Map对象的键名中,其内容保存在键值中,核心步骤有:
- 通过document.querySelector获取页面中“p”元素标签
- 初始化Map实例保存“p”标签DOM节点和内容
<body>
<p>1</p>
<script type="text/javascript">
/**
* 请补全JavaScript代码,要求将页面中的"p"标签以键名的形式保存在Map对象中,
* 键名所对应的键值为该"p"标签的文字内容。
*/
const _elementKey = () =>
// 补全代码
let p = document.querySelector('p')
return new Map([
[p, p.innerText]
])
console.log(_elementKey())
</script>
</body>
SQL练习题-牛客网
牛客网在线编程网址:https://www.nowcoder.com/activity/oj
(默认使用SQLite)
题目1:
删除emp_no重复的记录,只保留最小的id对应的记录
CREATE TABLE IF NOT EXISTS titles_test ( id int(11) not null primary key, emp_no int(11) NOT NULL, title varchar(50) NOT NULL, from_date date NOT NULL, to_date date DEFAULT NULL);
insert into titles_test values (‘1‘, ‘10001‘, ‘Senior Engineer‘, ‘1986-06-26‘, ‘9999-01-01‘), (‘2‘, ‘10002‘, ‘Staff‘, ‘1996-08-03‘, ‘9999-01-01‘), (‘3‘, ‘10003‘, ‘Senior Engineer‘, ‘1995-12-03‘, ‘9999-01-01‘), (‘4‘, ‘10004‘, ‘Senior Engineer‘, ‘1995-12-03‘, ‘9999-01-01‘), (‘5‘, ‘10001‘, ‘Senior Engineer‘, ‘1986-06-26‘, ‘9999-01-01‘), (‘6‘, ‘10002‘, ‘Staff‘, ‘1996-08-03‘, ‘9999-01-01‘), (‘7‘, ‘10003‘, ‘Senior Engineer‘, ‘1995-12-03‘, ‘9999-01-01‘);
delete from titles_test where id not in ( select min(id) from titles_test group by emp_no );
题目2:
将所有to_date为9999-01-01的全部更新为NULL,且 from_date更新为2001-01-01。
CREATE TABLE IF NOT EXISTS titles_test ( id int(11) not null primary key, emp_no int(11) NOT NULL, title varchar(50) NOT NULL, from_date date NOT NULL, to_date date DEFAULT NULL);
insert into titles_test values (‘1‘, ‘10001‘, ‘Senior Engineer‘, ‘1986-06-26‘, ‘9999-01-01‘), (‘2‘, ‘10002‘, ‘Staff‘, ‘1996-08-03‘, ‘9999-01-01‘), (‘3‘, ‘10003‘, ‘Senior Engineer‘, ‘1995-12-03‘, ‘9999-01-01‘), (‘4‘, ‘10004‘, ‘Senior Engineer‘, ‘1995-12-03‘, ‘9999-01-01‘), (‘5‘, ‘10001‘, ‘Senior Engineer‘, ‘1986-06-26‘, ‘9999-01-01‘), (‘6‘, ‘10002‘, ‘Staff‘, ‘1996-08-03‘, ‘9999-01-01‘), (‘7‘, ‘10003‘, ‘Senior Engineer‘, ‘1995-12-03‘, ‘9999-01-01‘);
update titles_test set to_date = NULL, from_date = ‘2001-01-01‘;
题目3:
将id=5以及emp_no=10001的行数据替换成id=5以及emp_no=10005,其他数据保持不变,使用replace实现。
insert into titles_test values (‘1‘, ‘10001‘, ‘Senior Engineer‘, ‘1986-06-26‘, ‘9999-01-01‘), (‘2‘, ‘10002‘, ‘Staff‘, ‘1996-08-03‘, ‘9999-01-01‘), (‘3‘, ‘10003‘, ‘Senior Engineer‘, ‘1995-12-03‘, ‘9999-01-01‘), (‘4‘, ‘10004‘, ‘Senior Engineer‘, ‘1995-12-03‘, ‘9999-01-01‘), (‘5‘, ‘10001‘, ‘Senior Engineer‘, ‘1986-06-26‘, ‘9999-01-01‘), (‘6‘, ‘10002‘, ‘Staff‘, ‘1996-08-03‘, ‘9999-01-01‘), (‘7‘, ‘10003‘, ‘Senior Engineer‘, ‘1995-12-03‘, ‘9999-01-01‘);
update titles_test set emp_no = replace(emp_no, ‘10001‘, ‘10005‘) where id = 5;
http://sqlite.org/lang_corefunc.html#replace
replace(X,Y,Z)
The replace(X,Y,Z) function returns a string formed by substituting string Z for every occurrence of string Y in string X. The BINARY collating sequence is used for comparisons. If Y is an empty string then return X unchanged. If Z is not initially a string, it is cast to a UTF-8 string prior to processing.
题目4:
将titles_test表名修改为titles_2017。
ALTER table titles_test rename to titles_2017
题目5:
在audit表上创建外键约束,其emp_no对应employees_test表的主键id。
CREATE TABLE employees_test( ID INT PRIMARY KEY NOT NULL, NAME TEXT NOT NULL, AGE INT NOT NULL, ADDRESS CHAR(50), SALARY REAL );
CREATE TABLE audit( EMP_no INT NOT NULL, create_date datetime NOT NULL );
Drop table audit; CREATE TABLE audit( EMP_no INT NOT NULL, create_date datetime NOT NULL, foreign key(emp_no) references employees_test(id) );
如果是在mysql中,可以直接用
Alter table audit add foreign key(emp_no) references employees_test(id);
见w3school.
以上是关于js牛客网编程练习汇总的主要内容,如果未能解决你的问题,请参考以下文章