技术文章 | Technical articles

JavaScript/js交互 贪吃蛇项目实战

一、 内置构造函数

1.1 String

这是一个内置构造函数, 它是string值类型的对应包装类型

这也就是为什么字符串可以调用方法的原因

举例:

// String string值类型的对应包装类型

var str = "abcdefg";

console.log(str[1]);

// 转为对应的包装类型

var str_obj = new String(str);

输出:

图片1.png

 

1.2 Boolean

这是一个内置构造函数, 它是bool值类型的对应包装类型

 

举例:

// Boolean

// 它是bool值类型的对应包装类型

var f = false;

// 转为对应的包装类型

var f_obj = new Boolean(f);

// fnew Boolean对象的原始值, 而new Booleanf的对应包装类型

// !f  true !f_obj false 因为f_obj是一个对象

// console.log(f_obj.valueOf())

 

 

1.3 Number

这是一个内置构造函数, 它是number值类型的对应包装类型

 

举例:

// Number

var num = 3;

// 转为对应的包装类型

var num_obj = new Number(num);

// Number本身不是一个安全类, 当Number自执行的时候, 会作为类型转为函数使用

var a = "3a";

var aa = Number(a);

 

二、 内置构造函数之间的关系

所有的函数都是Function的实例

所有的对象都是Object的实例

函数也是对象

 

 

三、 贪吃蛇

我们决定使用面向对象的方式书写贪吃蛇游戏

游戏是最合适使用面向对象的方式书写
我们把整个游戏看成是一个“游戏”类

游戏类可以有各种各样的属性

我们可以把贪吃蛇中的蛇作为一个属性

还有地图属性

食物属性

障碍物属性

 

我们可以把蛇当做一个“蛇”类

有数组属性

有方向属性

有增长方法

有移动方法

 

可以把地图看成一个地图类

有行属性

有列属性

有宽度属性 (总宽)

有高度属性  (总高)

有一个数组属性,数组中存放的是每一个小方格

 

可以把食物看成一个食物类

有一个x属性

有一个y属性

img属性

 

可以把障碍物看成是一个类

有一个数组属性

关注微信公众号“icketang”,获取最新前端资讯,学习资料  

微信个人号二维码.jpg
项目实战视频教程、web前端视频教程
,请添加微信“haomei0452”免费领取 


B站搜索“爱创课堂网络科技” 免费观看前端视频以及项目实战


QQ图片20190401143635.jpg


上一篇文章: 学完html+css就可以做的web前端项目实战
下一篇文章: 为什么要选择爱创课堂学前端?
更多详细内容请访问爱创官网首页:http://www.icketang.com/

最新发布 | 这里有最新的文章查看更多>>

爱创推荐 | 这里有推荐的文章查看更多>>