JS膏集02

1、复习







函数也是对象

2、贪食蛇案例

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <title>title</title>

  <style>

    .map {

      width: 800px;

      height: 600px;

      background-color: #CCC;

      position: relative;

    }

  </style>

</head>

<body>

<!--画出地图,设置样式-->

<div class="map"></div>

<script src="food.js"></script>

<script src="Snake.js"></script>

<script src="Game.js"></script>

<script>

  //初始化游戏对象

  var gm = new Game(document.querySelector(".map"));

  //初始化游戏---开始游戏

  gm.init();

  //外部测试代码

  //  var fd = new Food();

  //  fd.init(document.querySelector(".map"));

  //  //创建小蛇

  //  var snake = new Snake();

  //  snake.init(document.querySelector(".map"));//先在地图上看到小蛇

  //

  //

  //

  //  setInterval(function () {

  //    snake.move(fd, document.querySelector(".map"));

  //    snake.init(document.querySelector(".map"));

  //  }, 150);

  //  snake.move(fd, document.querySelector(".map"));//走一步

  //  snake.init(document.querySelector(".map"));//初始化---重新画一条小蛇(先删除之前的小蛇,把现在的小蛇显示出来)

  //  snake.move(fd, document.querySelector(".map"));

  //  snake.init(document.querySelector(".map"));

  //  snake.move(fd, document.querySelector(".map"));

  //  snake.init(document.querySelector(".map"));

  //  snake.move(fd, document.querySelector(".map"));

  //  snake.init(document.querySelector(".map"));

  //  snake.move(fd, document.querySelector(".map"));

  //  snake.init(document.querySelector(".map"));

  //  snake.move(fd, document.querySelector(".map"));

  //  snake.init(document.querySelector(".map"));

  //

  //  snake.move(fd, document.querySelector(".map"));

  //  snake.init(document.querySelector(".map"));

  //  fd.init(document.querySelector(".map"));

  //  fd.init(document.querySelector(".map"));

  //  fd.init(document.querySelector(".map"));

  //  fd.init(document.querySelector(".map"));

  //console.log(fd.x+"====>"+fd.y);

  //console.log(fd.width);

</script>

</body>

</html>

JS膏集02的更多相关文章

  1. JS膏集05

    JS膏集05 1.复习 闭包内的函数也可以使用参数 闭包的建议写法 ) 2.浅拷贝 相当于把一个对象中的所有的内容复制一份给另一个对象.直接复制. 或者说,就是把一个对象的地址给了另一个对象,它们指向 ...

  2. JS膏集04

    JS膏集04 1.apply和call方法 可以改变this的指向,可以用于函数的调用 apply和call方法中如果没有传入参数,或者传入null,那么调用该方法的函数中的this就是window ...

  3. JS膏集03

    JS膏集03 1.复习 原型: * 在构造函数中有一个属性:prototype,是原型,也是一个对象,程序员使用的 * 在实例对象中有一个属性:__proto__,是原型,也是一个对象,浏览器使用的, ...

  4. JS膏集01

    JS膏集01 1.动态页面: 向服务器发送请求,服务器那边没有页面,动态生成后,返回给客户端 由html/css/js组成. js还不是面向对象的语言,是基于对象的语言.js中没有类的概念,js的继承 ...

  5. JS自学笔记02

    JS自学笔记02 1.复习 js是一门解释性语言,遇到一行代码就执行一行代码 2.查阅mdn web文档 3.提示用户输入并接收,相比之下,alert只有提示的作用: prompt(字符串) 接收: ...

  6. 使用PM2将Node.js的集群变得更加容易

    介绍 众所周知,Node.js运行在Chrome的JavaScript运行时平台上,我们把该平台优雅地称之为V8引擎.不论是V8引擎,还是之后的Node.js,都是以单线程的方式运行的,因此,在多核心 ...

  7. JS方法集

    数组方法集 Angela.array = { //# 数组方法 // index, 返回位置! 不存在则返回 -1: index: function (t, arr) { //# 返回当前值所在数组的 ...

  8. vue.js插件使用(02) vue-router

    概述 vue-router是Vue.js官方的路由插件,它和vue.js是深度集成的,适合用于构建单页面应用.vue的单页面应用是基于路由和组件的,路由用于设定访问路径,并将路径和组件映射起来.传统的 ...

  9. 【 D3.js 选择集与数据详解 — 5 】 处理模板的应用

    在[选择集与数据 - 4]一文中,介绍了一个update.enter.exit的处理模板,这个模板很常用,本文将通过一个例子来讲解其使用方法. 1. 模板 复习一下上一章提到的模板. //绑定数据后, ...

随机推荐

  1. Google搜索

    https://www.google.com/intl/br/insidesearch/tipstricks/all.html 如何用好谷歌等搜索引擎?

  2. python全栈开发day52-bootstrap的运用

    1. css样式 2. 插件 3.  创建一个项目的步骤 1) npm init --yes  或 npm init -y npm init npm init:这个命令用于创建一个package.js ...

  3. 带你了解zabbix如何监控mysql主从到报警触发

    本章博客我们一起来聊一聊如何监控mysql数据库主从状态? 思路梳理: 1)首先我们都知道,判断Mysql主从是否正常,是通过主从上面的SQL和IO线程都为yes状态判断(通过awk取值,grep过滤 ...

  4. vue 中如何对公共css、 js 方法进行单文件统一管理，全局调用

    1.前言 最近,为公司开发交付的一个后台管理系统项目,我使用了 Vue 框架进行开发实践. 模块化.组件化.工程化的开发体验非常好.良好的 api,优雅的设计,对于工程师非常友好. 但是由于模块比较多 ...

  5. P2577 [ZJOI2005]午餐 状压DP

    题目描述 上午的训练结束了,THU ACM小组集体去吃午餐,他们一行N人来到了著名的十食堂.这里有两个打饭的窗口,每个窗口同一时刻只能给一个人打饭.由于每个人的口味(以及胃口)不同,所以他们要吃的菜各 ...

  6. Python 豆瓣mv爬取

    爬取网址:https://www.dbmeinv.com/       豆瓣mv(现已更名) 注:自制力不好的同学,先去准备营养快线! import requests from bs4 import ...

  7. linux 更新yum源 改成阿里云源

    1.备份 mv /etc/yum.repos.d/CentOS-Base.repo /etc/yum.repos.d/CentOS-Base.repo.backup 2.下载新的CentOS-Base ...

  8. TF之AE：AE实现TF自带数据集数字真实值对比AE先encoder后decoder预测数字的精确对比—Jason niu

    import tensorflow as tf import numpy as np import matplotlib.pyplot as plt #Import MNIST data from t ...

  9. CodeForces 433C Ryouko's Memory Note (中位数定理)

    <题目链接> 题目大意:给你一堆数字,允许你修改所有相同的数字成为别的数字,不过只能修改一次,问你修改后序列相邻数字的距离和最小是多少. 解题分析: 首先,修改不是任意的,否则那样情况太多 ...

  10. Django之第三方登陆模块

    Django之第三方登陆模块 前期准备 安装 django-allauth pip install django-allauth 注意,django-allauth 需要在 Django1.10以上版 ...