Question

我目前正在尝试使用JavaScript和HTML5来理解动画。根据我在互联网上研究后收集的内容，requestAnimationFrame重复调用一个方法。

我创建了一个平面，并创建了一个方法，可以将平面移动到对角线上。但是，似乎没有动画。

我对此很新，所以可能只是我没有得到这个概念。我不认为这是与我的浏览器有关，因为我在chrome和Internet Explorer上都尝试过，它们应该是最新的，因为我几个月前才安装它们，因为这是一台新的笔记本电脑。 / p>

这是我的主要课程，它应该包括所有相关代码：

<?php
// APR1-MD5 encryption method (windows compatible)
function crypt_apr1_md5($plainpasswd)
{
    $salt = substr(str_shuffle("abcdefghijklmnopqrstuvwxyz0123456789"), 0, 8);
    $len = strlen($plainpasswd);
    $text = $plainpasswd.'$apr1$'.$salt;
    $bin = pack("H32", md5($plainpasswd.$salt.$plainpasswd));
    for($i = $len; $i > 0; $i -= 16) { $text .= substr($bin, 0, min(16, $i)); }
    for($i = $len; $i > 0; $i >>= 1) { $text .= ($i & 1) ? chr(0) : $plainpasswd{0}; }
    $bin = pack("H32", md5($text));
    for($i = 0; $i < 1000; $i++)
    {
        $new = ($i & 1) ? $plainpasswd : $bin;
        if ($i % 3) $new .= $salt;
        if ($i % 7) $new .= $plainpasswd;
        $new .= ($i & 1) ? $bin : $plainpasswd;
        $bin = pack("H32", md5($new));
    }
    for ($i = 0; $i < 5; $i++)
    {
        $k = $i + 6;
        $j = $i + 12;
        if ($j == 16) $j = 5;
        $tmp = $bin[$i].$bin[$k].$bin[$j].$tmp;
    }
    $tmp = chr(0).chr(0).$bin[11].$tmp;
    $tmp = strtr(strrev(substr(base64_encode($tmp), 2)),
    "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/",
    "./0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz");

    return "$"."apr1"."$".$salt."$".$tmp;
}

// Password to be used for the user
$username = 'test';
$password = 'test';

// Encrypt password
$encrypted_password = crypt_apr1_md5($password);

// Print line to be added to .htpasswd file
echo $username . ':' . $encrypted_password;

如果您认为有助于查看任何相关方法，请与我们联系。我也附上了结果。

Answer 1

这里有很多东西未定义（Matrix和Vector对象及其方法）。如果您有代码，请附上代码，否则请继续阅读。

您的面向对象的JS知识似乎有点差距。我猜你知道很多这方面的知识，但是值得花时间巩固你对以下方面的了解：

知道如何制作新物品。了解对象是什么。
了解如何构建构造函数。
了解使用 new 关键字只是调用对象的构造函数。
了解继承。此关键字与原型继承。
了解封装。
了解Canvas API
为您的代码添加评论。如果其他人要阅读您的代码，请添加评论。它有助于。你真正需要的是每个函数的单个注释，解释它的作用。解释输入参数是有用的。

以下是一些可以帮助您入门（也许已经完成）的资源：

阅读本文（这是两个先决条件）：http://javascriptissexy.com/oop-in-javascript-what-you-need-to-know/
查看内置的Canvas方法：https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API

以下是缺少的代码结构

function Vector(x, y, z) {
  this.x = x;
  this.y = y;
  this.z = z;
}

var Matrix = {
  createTranslation: function() {
  
  }, 
    createRotation: function() {
    
  }, 
    createScale: function() {
    
  }, 
  transform: function() {
    
  }
};

function Plane(position) {
  this.add = function() {
  this.draw = function() {
    
  };
  };
}

function Moth(position) {
  this.draw = function() {
    
  };
}

我知道这不能回答你的问题而且我很可能会被投降到地狱，但是在你明白自己做得更好之前我无法帮助你。祝你好运！

简单的requestAnimationFrame不能正常使用JavaScript

1 个答案: