<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script src="./simba.js"></script>
<script src="./util.js"></script>
<script>
//类
function User(nickname, pwd) {
this.nickname = nickname
this.pwd = pwd
}
function Pet(nickname, gender, state, owner) {
this.nickname = nickname
this.gender = gender
this.state = state
this.owner = owner
}
function Dog(nickname, gender, state, owner) {
Pet.call(this, nickname, gender, state, owner)
this.introduceSelf = function () {
console.log(`
你的骨头就是我的骨头，我叫${this.nickname}
我是个${fmtGender(this.gender)}孩子
我的状态值目前是${this.state}
我的召唤师叫${this.owner}
`);
}
this.eat = _.throttling(function () {
console.log(this.nickname + '吃骨头咯~');
this.state += 20
}, 3000)
this.play = function () {
console.log(this.nickname + '玩飞盘去咯~');
this.state += 10
}
}
function Cat(nickname, gender, state, owner) {
Pet.call(this, nickname, gender, state, owner)
this.introduceSelf = function () {
console.log(`
虱子如风常伴吾身，我叫${this.nickname}
我是个${fmtGender(this.gender)}孩子
我的状态值目前是${this.state}
我的召唤师叫${this.owner}
`);
}
this.eat = _.throttling(function () {
console.log(this.nickname + '吃烤鱼咯~');
this.state += 15
}, 6000)
this.play = function () {
console.log(this.nickname + '玩猫球去咯~');
this.state += 8
}
}
let pet = new Pet()
Dog.prototype = pet
Cat.prototype = pet
let game = {
service: {
loginUser: "",
userList: [
new User('ace', '123123')
],
petList: [],
sensitiveWords: ['TMD', 'QNM', 'CNM'],
getMyPetInfo() {
return this.petList.find(r => r.owner === this.loginUser)
},
register(nickname, pwd) {
let user = new User(nickname, pwd)
this.userList.push(user)
},
registerPet(nickname, type, gender) {
let pet = null
switch (type) {
case '1':
pet = new Dog(nickname, gender, 80, this.loginUser)
break;
case '2':
pet = new Cat(nickname, gender, 80, this.loginUser)
break;
}
this.petList.push(pet)
},
login(nickname, pwd) {
return this.userList.some(r => _.eq(r.nickname, nickname) && _.eq(r.pwd, pwd))
},
checkUserHasPet() {
return this.petList.some(r => _.eq(r.owner, this.loginUser))
},
checkUserRepeat(nickname) {
return this.userList.some(r => _.eq(r.nickname, nickname))
},
checkSensitiveWords(str) {
return this.sensitiveWords.includes(str)
}
},
showBuyPetPage() {
if (this.service.checkUserHasPet()) {
console.log('您已经拥有一只宠物了，请好好珍惜');
return this.showMainPage()
}
let nickname = '', type = '', gender = ''
let isValidNickName = false,
isValidType = false,
isValidGender = false
do {
type = _.trim(prompt('请选择宠物类型: 1.狗 2.猫'))
isValidType = ['1', '2'].includes(type)
if (!isValidType)
console.log('类型输入有误！');
} while (!isValidType);
do {
nickname = _.trim(prompt('请输入宠物昵称'))
isValidNickName = _.checkStrHasVal(nickname)
if (!isValidNickName)
console.log('昵称不能为空...');
if (this.service.checkSensitiveWords(nickname)) {
isValidNickName = false
console.log('昵称不能包含敏感词汇');
}
} while (!isValidNickName);
do {
gender = _.trim(prompt('请选择宠物性别: 1.GG 2.MM'))
isValidGender = ['1', '2'].includes(gender)
if (!isValidGender)
console.log('性别输入有误！');
} while (!isValidGender);
this.service.registerPet(nickname, type, gender)
this.showMainPage()
},
showPetDetailPage() {
let mypet = this.service.getMyPetInfo()
if (mypet) {
mypet.introduceSelf()
this.showGamePage(mypet)
} else
console.log('您还没有宠物，快去领养一只吧~')
this.showMainPage()
},
showGamePage(pet) {
let res = prompt('请选择操作：1.喂食 2.逗TA玩 3.返回')
switch (res) {
case '1':
pet.eat()
break;
case '2':
pet.play()
break;
case '3':
break;
default:
console.log('输入有误,请重新输入');
arguments.callee.call(this, pet)
break;
}
pet.introduceSelf()
},
showLoginPage() {
let nickname = '', pwd = ''
let isValidNickName = false,
isValidPwd = false
do {
nickname = _.trim(prompt('请输入昵称'))
isValidNickName = _.checkStrHasVal(nickname)
if (!isValidNickName)
console.log('昵称不能为空...');
} while (!isValidNickName);
do {
pwd = _.trim(prompt('请输入密码'))
isValidPwd = _.checkStrHasVal(pwd, 6)
if (!isValidPwd)
console.log('密码不能为空...');
} while (!isValidPwd);
if (this.service.login(nickname, pwd)) {
console.log('登录成功');
this.service.loginUser = nickname
this.showMainPage()
} else {
console.log('用户名或密码错误');
arguments.callee.call(this)
}
},
showMainPage() {
let result = prompt('欢迎' + this.service.loginUser + '，请选择操作：1.领养宠物 2.查看宠物 3.注销')
switch (result) {
case '1':
this.showBuyPetPage()
break;
case '2':
this.showPetDetailPage()
break;
case '3':
this.service.loginUser = ''
this.showWelcomePage()
break;
default:
console.log('输入有误,请重新输入');
arguments.callee.call(this)
break;
}
},
showRegisterPage() {
let nickname = '', pwd = '', c_pwd = ''
let isValidNickName = false,
isValidPwd = false,
isValidCPwd = false
do {
nickname = _.trim(prompt('请输入昵称'))
isValidNickName = _.checkStrHasVal(nickname)
if (!isValidNickName)
console.log('昵称不能为空...');
if (this.service.checkUserRepeat(nickname)) {
isValidNickName = false
console.log('昵称已存在');
}
if (this.service.checkSensitiveWords(nickname)) {
isValidNickName = false
console.log('昵称不能包含敏感词汇');
}
} while (!isValidNickName);
do {
pwd = _.trim(prompt('请输入密码'))
isValidPwd = _.checkStrLength(pwd, 6)
if (!isValidPwd)
console.log('密码长度不能小于6位...');
} while (!isValidPwd);
do {
c_pwd = _.trim(prompt('请输入密码'))
isValidCPwd = _.eq(pwd, c_pwd)
if (!isValidCPwd)
console.log('两次密码不一致...');
} while (!isValidCPwd);
this.service.register(nickname, pwd)
this.showWelcomePage()
},
showWelcomePage() {
let result = prompt('欢迎来到MYPET，请选择操作：1.登录 2.注册 3.关闭')
switch (result) {
case '1':
this.showLoginPage()
break;
case '2':
this.showRegisterPage()
break;
case '3':
console.log('已关闭');
break;
default:
console.log('输入有误,请重新输入');
arguments.callee.call(this)
break;
}
}
}
game.showWelcomePage()
</script>
</body>
</html>
案例中引入JS封装代码段
let _ = {
eq(a, b) {
return a === b
},
throttle(fn, wait) {
let endTime = +new Date
return function () {
if (+new Date - endTime < wait) {
return;
}
fn.apply(this, arguments)
endTime = +new Date
}
},
trim(str) {
if (!str) return ''
return str.trim()
},
isOdd(val) {
return val % 2 !== 0
},
isEven(val) {
return !this.isOdd(val)
},
checkStrNullOrEmpty(str) {
return !str || str.trim() === ''
},
checkStrHasVal(str) {
return !this.checkStrNullOrEmpty(str)
},
checkStrLength(str, len) {
return str && str.trim().length >= len
},
setCookie(key, val, expires) {
if (typeof val === 'object')
val = JSON.stringify(val)
let now = new Date()
now.setMinutes(now.getMinutes() + expires)
document.cookie = `${key}=${encodeURI(val)};expires=${now.toUTCString()}`
},
removeCookie(key) {
this.setCookie(key, null, -1)
},
getCookie(key) {
let obj = {}
document.cookie.split('; ').forEach(r => {
let kv = r.split('=')
obj[kv[0]] = decodeURI(kv[1])
})
if (key) {
let res = null
try {
res = JSON.parse(obj[key])
} catch (error) {
res = obj[key]
} finally {
return res
}
}
return obj
},
keys(obj) {
let arr = []
for (const key in obj) {
arr.push(key)
}
return arr
}
}
449
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
