怎样建设小游戏网站软件开发最新技术

怎样建设小游戏网站,软件开发最新技术,网址安全检测中心,天津网站设计制作公司欢迎使用我的小程序#x1f447;#x1f447;#x1f447;#x1f447; 俱好用助手功能介绍 大家好#xff01;今天我们要聊一个听起来有点“高大上”的话题——JavaScript面向对象编程#xff08;OOP#xff09;。别担心#xff0c;我不会用一堆专业术语砸晕你#…欢迎使用我的小程序 俱好用助手功能介绍大家好今天我们要聊一个听起来有点“高大上”的话题——JavaScript面向对象编程OOP。别担心我不会用一堆专业术语砸晕你而是要用做美食的方式来解释这个概念厨房里的“对象思维”想象一下你是一位厨师要制作一批美味的杯子蛋糕。在面向对象的世界里类Class 你的杯子蛋糕食谱对象Object 按照食谱做出来的一个个杯子蛋糕属性Property 蛋糕的特征颜色、口味、尺寸方法Method 蛋糕能做的事被吃掉、被装饰第一步创建你的“食谱”类在JavaScript中我们有几种方式创建“食谱”传统方式 - 构造函数// 杯子蛋糕“食谱”functionCupcake(flavor,color,topping){// 这些是蛋糕的属性this.flavorflavor;// 口味this.colorcolor;// 颜色this.toppingtopping;// toppingsthis.isEatenfalse;// 是否被吃了// 这是蛋糕能做的事方法this.eatfunction(){this.isEatentrue;return美味的${this.flavor}口味杯子蛋糕被吃掉了;};this.describefunction(){return这是一个${this.color}色的${this.flavor}口味杯子蛋糕上面有${this.topping}。;};}// 按照食谱制作蛋糕创建对象constmyCupcakenewCupcake(巧克力,棕色,彩虹糖);console.log(myCupcake.describe());// 输出描述console.log(myCupcake.eat());// 吃掉它现代方式 - ES6类语法ES6给了我们更直观的写法classCupcake{constructor(flavor,color,topping){this.flavorflavor;this.colorcolor;this.toppingtopping;this.isEatenfalse;}eat(){this.isEatentrue;return美味的${this.flavor}口味杯子蛋糕被吃掉了;}describe(){return这是一个${this.color}色的${this.flavor}口味杯子蛋糕上面有${this.topping}。;}}// 使用方式一样constbirthdayCupcakenewCupcake(香草,粉色,生日蜡烛);第二步继承 - 美食界的“家族秘方”假设现在你想做一种特殊杯子蛋糕——生日杯子蛋糕。它具备普通杯子蛋糕的所有特性但还有一些额外功能classBirthdayCupcakeextendsCupcake{constructor(flavor,color,topping,age){super(flavor,color,topping);// 调用父类的构造方法this.ageage;// 新增属性this.candleLitfalse;// 新增属性}// 新增方法lightCandle(){this.candleLittrue;return为${this.age}岁生日点亮了蜡烛;}// 重写父类方法describe(){return${super.describe()}这是为${this.age}岁生日特别制作的;}}// 试试看constmyBirthdayCakenewBirthdayCupcake(草莓,红色,奶油花,8);console.log(myBirthdayCake.describe());// 调用重写后的方法console.log(myBirthdayCake.lightCandle());// 调用新方法console.log(myBirthdayCake.eat());// 继承自父类的方法第三步封装 - 像包装食品一样保护数据好的包装既能展示食物又能保护它。在OOP中我们通过封装来控制对对象内部状态的访问classSecretRecipeCupcake{constructor(secretIngredient){letsecretsecretIngredient;// 私有变量外部无法直接访问// 公开的方法可以访问私有变量this.getHintfunction(){return秘方里有一种让蛋糕格外松软的${secret.slice(0,3)}...成分;};this.setSecretfunction(newSecret){// 可以在这里添加验证逻辑if(newSecret.length2){secretnewSecret;return秘方更新成功;}return秘方太短无效;};}}constmysteryCakenewSecretRecipeCupcake(魔法酵母);console.log(mysteryCake.secret);// undefined - 无法直接访问console.log(mysteryCake.getHint());// 通过公开方法获取提示第四步多态 - 同一个动作不同的表现多态就像不同的厨具都能“处理食材”但方式不同classOven{bake(item){returnitem.bake();}}classCupcake{bake(){return杯子蛋糕在350°F下烘焙20分钟;}}classBread{bake(){return面包在400°F下烘焙40分钟;}}constmyOvennewOven();constcupcakenewCupcake();constbreadnewBread();console.log(myOven.bake(cupcake));// 不同的对象相同的方法名不同的实现console.log(myOven.bake(bread));现实世界例子一个简单的购物车让我们用OOP思想构建一个购物车系统classProduct{constructor(name,price){this.namename;this.priceprice;}getInfo(){return${this.name}- ¥${this.price};}}classShoppingCart{constructor(){this.items[];}addItem(product,quantity1){this.items.push({product,quantity});console.log(已将${quantity}个${product.name}加入购物车);}calculateTotal(){returnthis.items.reduce((total,item){returntotal(item.product.price*item.quantity);},0);}checkout(){consttotalthis.calculateTotal();console.log(总计¥${total});console.log(感谢购买);this.items[];// 清空购物车}}// 使用购物车constcartnewShoppingCart();constapplenewProduct(苹果,5);constmilknewProduct(牛奶,20);cart.addItem(apple,3);cart.addItem(milk,2);cart.calculateTotal();cart.checkout();小贴士与常见陷阱别忘了new关键字new Cupcake()不是Cupcake()this的指向问题箭头函数中的this行为不同原型链是JavaScript的特色对象之间通过原型链连接像美食界的师徒传承总结JavaScript面向对象编程就像经营一家糕点店类是你的食谱对象是按食谱制作的糕点继承让你创造新品种而不从头开始封装保护你的秘方多态让你用相同的方式处理不同糕点最重要的是OOP不是必须的而是工具箱中的一件工具。对于简单的任务也许普通函数就够了但对于复杂的系统OOP能让代码更有组织、更易维护。现在去创造你的JavaScript“美食”吧如果遇到问题记住每个编程大师都曾把蛋糕烤糊过几次。练习时间尝试创建一个“Pizza”类然后扩展出“SpecialtyPizza”子类添加你自己的特色配料和方法下次话题预告JavaScript异步编程 - 就像在餐厅同时服务多桌客人