下面的考核题,前端和后端的是不一样的。 前端的同学任选一题前端的题,后端的同学任选一题后端的题
对于所有题目,代码结构都会作为评判的一个重要标准! 尽可能把你的打码写漂亮(不只是长的漂亮)
不懂啥是TodoList的自行Google
- 界面不能照抄网上已有页面的风格,可以把网上的设计稿做成你的页面,也可以自己设计
- 不能使用任何已有的库(如
jQuery
,Bootstrap
,Vue
等) - 增加、删除、修改的操作执行后,页面不能刷新
-
增删改查
增删改查是指可以实现“增加”、“删除”、“修改”、“查询”四个功能。 其中“查询”不代表“搜索”,只要页面刷新后,数据能够正常显示即可。
-
可以储存 “内容” 与 “是否已完成” 的状态
-
使用
localStorage
储存数据 -
界面尽可能做的好看
-
可以只显示“未完成”或“已完成”的条目
你可以把它们分开显示,或者是通过按钮切换显示,或者你也可以自己想一种把它们分开显示的方法
-
给每一条todo添加 “完成日期”
-
在第二点的基础上,已过期的条目有不同的样式
-
其它更牛逼的功能
- 不能使用任何已有的库(如
lodash
,underscore
等) - 不能去查
jQuery
源码
-
能够通过
$
标识符来访问myQuery
-
能够通过CSS选择器来选择特定的元素
-
能对选定的元素执行以下操作:
如果不知道这些操作是什么的自行Google
addClass(class)
,hasClass(class)
,removeClass(class)
,toggleClass(class)
css(property)
,css(property, value)
each(func)
find(selector)
hide()
,show()
,toggle()
html()
,html(content)
remove()
- 能通过
$(window)
和$(document)
执行部分操作 - 能通过
$(func)
实现当DOM加载完成时,执行func
函数 - 能对选定的元素执行以下操作:
attr(name)
,attr(name, value)
css(cssObject)
on(event, handler)
,once(event, handler)
,off(event, handler)
offset()
,offset(coordinates)
text()
,text(content)
- 有一份较为详细的使用文档
注:后端可以使用任何在npm上已有的库
不懂啥是TodoList的自行Google
- 数据可以在本地储存(文件、数据库都可以),后端服务重启后依然能有数据
- 一条todo能够拥有以下属性
- 内容
- 完成日期
- 是否已完成
- 实现以下API
GET
/api/todos
获取所有todoGET
/api/todos?search=
根据内容搜索todoPOST
/api/todo/:id
修改某条todoPUT
/api/todos
添加一条todoDELETE
/api/todo/:id
删除某条todo
- 保存每个访问的log
- 使用数据库储存数据
- 有个简单的登录系统
可以使用任意方式实现这个登录系统
- 实现koa2的以
Promise
为基础的middleware机制 - 简单实现koa的
ctx
功能(提示:使用getter和setter)ctx.headers
ctx.method
,ctx.method=
ctx.path
,ctx.path=
ctx.query
,ctx.query=
ctx.querystring
ctx.originalUrl
ctx.body
,ctx.body=
ctx.status
,ctx.status=
- 如果没有一个middleware对一个请求产生响应,默认返回404状态码
- 完整实现
ctx
的功能