js面向对象写法中使用requestAnimationFrame报错,求高手指点


js面向对象写法中使用requestAnimationFrame报错:

Failed to execute 'requestAnimationFrame' on 'Window': The callback provided as parameter 1 is not a function.*/

js:

    function parcicles() {
    var w = window.innerWidth;
    var h = window.innerHeight;
    this._w = w;
    this._h = h;
    this.pSize = Math.floor(Math.random() * 4);
    this.l = Math.random() * this._w;
    this.t = Math.random() * this._h;
    var r = Math.random() * 255 >> 0,
        g = Math.random() * 255 >> 0,
        b = Math.random() * 255 >> 0,
        a = Math.floor(Math.random() * 10);
    this.lineColor = 'rgba(' + r + ',' + g + ',' + b + ',' + a + ')';
}

parcicles.prototype = {
    emptyArray: [],
    length: 30,
    created: function () {
        for (var i = 0; i < this.length; i++) {
            this.emptyArray.push(new parcicles());
        }
    },
    createCanvas: function () {
        this.c = document.getElementById("c");
        this.ctx = this.c.getContext('2d');
        this.c.width = this._w;
        this.c.height = this._h;
    },
    draw: function () {
        console.log(1);
        for (var j = 0; j < this.length; j++) {
            this.ctx.beginPath();
            this.ctx.fillStyle = this.emptyArray[j].lineColor;
            this.ctx.arc(this.emptyArray[j].l, this.emptyArray[j].t, this.emptyArray[j].pSize, 0, Math.PI * 2, true);
            this.ctx.fill();
            this.ctx.closePath();
        }
    },
    move: function () {
        this.draw();
        requestAnimaFrame(this.move);
        // 上面的代码报错: Failed to execute 'requestAnimationFrame' on 'Window': The callback provided as parameter 1 is not a function.,了解但是不会修改 :[
    },
    init: function () {
        this.created();
        this.createCanvas();
        this.draw();
        this.move();
    }
}
var requestAnimaFrame = function (callback) {
    return window.requestAnimationFrame(callback) ||
        window.webkitRequestAnimationFrame(callback) ||
        window.mozRequestAnimationFrame(callback) ||
        window.oRequestAnimationFrame(callback) ||
        window.msRequestAnimationFrame(callback) ||
        function (callback) {
            setInterval(callback, 1000 / 60);
        }
};

var p = new parcicles();
p.init();

html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet" href="css/canvas.css">
</head>
<body>
    <canvas id="c">sorry</canvas>
    <script src="js/canvas.js"></script>
</body>
</html>

请大神给解决下,问题知道出在哪里,就是不会改。因为传入的参数不是简单的函数名,但是面向对象的写法就要是this.draw()才能运行。求指点



相关阅读:
C语言的复杂声明的使用场景是什么呢?
博客系统数据库设计(链接与文章、分类、静态页面)
为什么互联网金融平台用Java开发比较多?除了安全还有什么优势?好招人?
nginx+gunicron+flask如何实现服务平滑升级?
php下载flv文件或者mp4文件无法播放
python查询数据库最新数据
使用C语言播放MP3文件
为什我用V-model的值放到vux管理,就不是动态的了
网站管理后台的那种点击左边链接,在右侧显示如何通过js实现?
centos中查询php配置文件
node怎么判断是开发环境还是生产环境??
怎样用jquery生成带有倾斜角度的验证码
如何滑动页面,当元素出现在当前屏幕时,才执行动画
intell idea打开项目后卡住,界面一直白色,求拯救!
在前端工程化的趋势下,php还有必要去渲染视图层吗?
奇异的代码 之 PHP中的错误和异常
用ajax调取的图片url,图片是存在webroot/images/目录下,为什么图片不能及时加载?
kill命令如何一次杀死多个进程
求react 中使用fetch的demo
大类点击之后得到的列表用pagination 插件进行了ajax分页问题



快速导航
PHP MySQL HTML CSS JavaScript MSSQL AJAX .NET JSP Linux Mac ASP 服务器 SQL jQuery C# C++ java Android IOS oracle MongoDB SQLite wamp 交通频道 作文范文 作文我这个人600字 散文:喜欢特别的你 新劳动法辞退赔偿 读《上下五千年》有感作文1500字 阅读需要一种定力——读《阅读是一种定力》有感 春雨过后作文500字 小学五年级作文450字:塑料袋的旅行 2015教育工作总结报告 15永生的眼睛 遇见你 在你最美丽的时候 走遍天下书为侣(转载)作文400字 有关沉默的语句 小学五年级作文500字:青花瓷 清远漂流记作文700字 劳动保障合同怎么写 我胆小吗?作文300字 寻根北大荒,圆梦北大荒 挫折也是一比财富 再论清代是中国封建经济发展的高峰 疯狂抢食战400字 简单快乐! 高考满分作文600字:启门一瞬观 四十是惑还是不惑 2015科室院感工作计划 桃花月 战鼓的余音 5月1日劳动节祝福短信 县教育局学习实践活动整改落实阶段情况总结 2016内勤工作转正申请书 小学五年级作文450字:这也是一种文化 三年磨一剑 桃李笑东风作文400字 学校工作年度工作总结 烟雨沧桑钟鼓楼 校园保安心得体会(精选4篇) 大学生党章学习思想汇报 暖冬夜里说故事 工商分局工作总结 生女儿祝福语 散文:没有你的日子,我呼吸了吗? 保姆阿姨 给远方表哥的一封信作文600字 清点天真作文1300字 共聚莱蒙城 共度聋人节 回忆学校的句子 人的一生就是一场经历,走到最后只剩回忆 2015渔业安全生产工作方案 并不是所有人都能接受,所以沟通真的很重要! 小学五年级作文900字:快乐的动物学校 我有一帘幽梦作文500字 凉席作文200字 生活活动:宝宝爱洗脸

Copyright © 2016 phpStudy |