百度前端技术学院是一个为大学生创办的免费的前端技术实践、分享、交流平台。由百度校园招聘组、百度校园品牌部、百度前端技术部以及多个百度的前端团队联合创办。学院组织了一批百度在职工程师,精心编写了数十个实践编码任务,将技术知识点系统有机地串联在各个充满趣味与挑战的任务中,同学们通过实际地编码练习来掌握知识,再辅以互相评价、学习笔记等方式,加深对于学习内容的理解。在过去的三年中,百度前端技术学院累积吸引了上万名同学参加,并且有数十名同学在学习后,顺利加入了百度,成为了百度的前端工程师。

第五十八天到第六十二天:足球小将(二)

困难

人数45人在学习该课程,有18人已经完成该课程

时间平均用时3.2

关键词JavaScript

课程概述

作业提交截止时间:09-01

第五十八天到第六十二天:足球小将(二)

课程目标

通过趣味练习,来强化对于 JavaScript 的熟悉

持续练习如何对于问题进行抽象,应用面向对象或者各种设计模式进行问题的解决

这也是本次2018百度前端技术学院零基础班最后一个任务,祝大家学习开心

课程描述

创建一个足球

需求

创建一个足球,用一个圆形表示,足球大小的直径假设为0.5米(不太真实,但为了看清),实际显示大小按照球场像素进行对应变化。

足球不妨找一个图片做贴图

足球有一个方法是移动,参数为运动方向、初速度、加速度,先假设足球只在草地平面移动。加速度为全局常量。

验证

创建足球,尝试各种参数的搭配,观察足球在运动场上的运动轨迹。

跑向足球

跑向静止的足球

实现运动员跑向足球并停球的行为。

随机生成足球和运动员的位置,然后运动员向足球跑去,直到运动员和足球相接后,运动员和足球停下来

跑向移动的足球

随机生成足球和运动员的位置,并让足球开始移动,接下来让运动员进行一个预判,并开始向足球可能接到的位置跑去,跑的过程中可能需要定期调整运动员奔跑的方向。

踢出足球

简单地踢出足球

给足球运动员增加一个踢出足球的方法,参数为期望球运动的方向,期望足球初速度。

我们先简单实现踢出足球的实现,按照给定的参数,踢出足球。

实现以下踢球:

  • 球员在球场中心向球门踢出足球
  • 球员从小禁区向球场中心踢出足球
  • 球员从角球区向点球点踢出足球
  • 球员从大禁区角附近,向球门踢出足球
  • 球员从本方禁区附近向对方半场边线踢出足球

给球员增加两个属性

现在,我们稍微模拟一下真实情况,我们给球员增加两个属性:技术、力量

技术决定运动员踢球方向的准确性和力量控制的准确性,力量决定踢球的最大速度。

两个属性依然都是 1-99 的正整数。

对于力量的设定可以为:

  • 力量为 1 的静止运动员踢出静止足球的最大初速度为 5米/秒
  • 力量为 99 的静止运动员踢出静止足球的最大初速度为 50米/秒
  • 力量和静止态踢出静止足球的最大初速度为线性关系
  • 运动状态的球员可以提升或减小踢出足球的最大初速度,以球员运动方向和踢出足球方向来计算,方向完全相同,加速最大,方向完全相反,减速最大。范围为-40%到40%。

对于技术的设定可以为:

  • 技术对于方向及力量的控制符合正态分布
  • 技术值越低,实际踢出的方向越容易出现和期望方向角度偏离的情况
  • 技术值越高,实际踢出的方向越不容易出现和期望方向角度偏离的情况
  • 技术值越低,实际踢出的初速度越容易出现和期望初速度偏离的情况,注意实际初速度不能超过最大初速度
  • 技术值越高,实际踢出的初速度越不容易出现和期望初速度偏离的情况,注意实际初速度不能超过最大初速度
  • 技术值越低,正态分布的方差越大
  • 技术高越低,正态分布的方差越小
  • 技术值与方差大小可以为线性关系,也可以自定义

阅读

实现具体以下内容

  • 在页面中增加一个球员生成器,可以设置球员的各种属性
  • 在页面中可填写球员、球的位置
  • 在页面中可填写球员的动作及对应参数,然后有按钮进行对应动作执行

再复杂一些

我们知道,运动员大部分时候是在运动过程中踢球,不同的角度,运动状态,会导致踢出足球的速度,角度都有偏差

静止地踢静止的球

这是我们上面做的情况,所有参数以运动员自身属性来决定

运动地踢静止的球

运动员的运动方向和球需要踢出的方向的夹角,对于最后实际踢出球的方向及初速度有一定影响,我们假设有以下影响,你也可以根据自己经验重新设定这些影响。当然我们更建议你在页面中实现参数的配置,来动态实现参数的调整,并实时进行预览

  • 运动员的运动方向和球需要踢出的方向的夹角,会对方向控制的方差产生一定影响,我们假设夹角为 a(区间为 0° 到 360°)。
  • 假设方向影响因子为 b,这个 b 会对计算概率的方差进行一个乘积的影响,即 方差 = 原方差 * b
  • 夹角 a 为 0° 时候,b = 1(参考值,可自定)
  • 夹角 a 为 180° 时候,b = 2(参考值,可自定)
  • a 与 b 可以为线性关系
  • 对力量的控制同理

静止地踢运动的球

  • 有时候踢侧面来的球,踢出的球大概率会有一个原始方向的偏移,所以球的运动方向也会对踢出球的方向有影响,我们假设影响如下
  • 球原本运动的方向和踢出足球的方向的夹角为 a(区间为 0° 到 360°),踢出方向的正态分布概率密度函数均值 μ 会因为 a 而产生向球运动的方向进行一定量的偏移 c
  • 当 a 为 0° 或者 180° 时,踢出的期望方向不受球的运动方向影响,c 为 0
  • 当 a 为 90° 或者 270° 时,踢出的期望方向最受球的运动方向影响,c 为偏 30°对应的偏差(参考值,可自定)
  • a 与 c 可以为线性关系
  • 计算出 c 后,是否真实产生偏差,还和球员技术相关,根据球员技术,根据正态分布,计算出不会出现偏差 c 的概率,最后实际出现的偏差为 c * (1 - 不会出现偏差的概率)。所以,当球员技术很好时,c 大概率为 0,或者是个极小值,对最后方向影响最小。

运动地踢运动的球

结合上面两者,进行最复杂的踢球的实现,运动的球员踢出运动的球。

实现各种参数的可视化配置,然后不断调参,找到最模拟真实的参数配置吧。

提交

把代码及预览地址进行提交

总结

依然把今天的学习用时,收获,问题进行记录

下一个任务预告

下一个任务我们将进行最后一个练习

学员提交的作业 (-)
学员名称提交时间提交的代码预览效果评价数平均得分操作
课程优秀学习笔记

暂无优秀学习笔记~