将coffeescript函数转换为javascript

我正在关注此railscast https://www.youtube.com/watch?v=ltoPZEzmtJA，但我不使用coffeescript。我试图将咖啡转换为JavaScript，但我遇到了问题。将coffeescript函数转换为javascript

CoffeeScript的

jQuery -> 
    new AvatarCropper() 

class AvatarCropper 
    constructor: -> 
    $('#cropbox').Jcrop 
     aspectRatio: 1 
     setSelect: [0, 0, 600, 600] 
     onSelect: @update 
     onChange: @update 

    update: (coords) => 
    $("#crop_x").val coords.x 
    $("#crop_y").val coords.y 
    $("#crop_w").val coords.w 
    $("#crop_h").val coords.h

js.erb文件

$(document).ready(function() { 

    $('.crop-image').on('click', function() { 
    $('#cropbox').Jcrop({ 
     aspectRatio: 1, 
     setSelect: [0, 0, 100, 100], 
     onSelect: update, 
     onChange: update 
    }) 
    }); 

    update: (function(_this) { 
    return function(coords) { 
     $('.user').val(coords.x); 
     $('.user').val(coords.y); 
     $('.user').val(coords.w); 
     return $('.user').val(coords.h); 
    }; 
    })(this) 

});

我不明白为什么他决定做一个类，并认为这将是更为复杂的整体转换事情。我遇到的麻烦是更新功能。我只是把咖啡脚本的更新功能插入转换器并使用输出。这是导致错误说没有定义更新。我哪里错了？

还有一个问题：他在这里上课的意义何在？

谢谢！

来源

2016-07-22 user4584963

您可以使用此转换http://js2.coffee/ –

“为什么要使用类，你可以用C写！“ – metalim

我一直在阅读Javascript的好的部分和“构建一个类的方法”在那里与隐私的优势，即暴露一个对象的更少的属性 – engineerDave

您的语法看起来不对...... :用于声明带标记的语句。

这是一个正确的方法。声明一个悬挂的变量并分配一个函数ref。到它。函数名称也可以出现在表达式函数中，所以它可以使用它的名字来引用它本身。

使用var函数变量应该提升，除了赋值。

/* there are various ways to declare a function */ 

function update(coords) { 
    var $users = $('.user'); 
    $users.val(coords.x); 
    $users.val(coords.y); 
    $users.val(coords.w); 
    return $users.val(coords.h); 
}

来源

2016-07-22 12:21:24 Hydro

对不起，我的代码错了，coords应该是x， y，w，h我会改变它..抄写错误 – user4584963

@ user4584963完成... – Hydro

另外，在railscast中，他提出了一个观点，他说他正在使用胖箭头......关于上下文的一些问题，我不确定是什么意即。你的回答是否解释了这个问题？ – user4584963

一类的观点：

使其更容易与碰撞更少的空间上不同的元素相同的任务多次运行。当
帮助智障组织代码

要转换，使用这样的网站http://js2.coffee/

var AvatarCropper, 
    bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; }; 

jQuery(function() { 
    return new AvatarCropper(); 
}); 

AvatarCropper = (function() { 
    function AvatarCropper() { 
    this.update = bind(this.update, this); 
    $('#cropbox').Jcrop({ 
     aspectRatio: 1, 
     setSelect: [0, 0, 600, 600], 
     onSelect: this.update, 
     onChange: this.update 
    }); 
    } 

    AvatarCropper.prototype.update = function(coords) { 
    $("#crop_x").val(coords.x); 
    $("#crop_y").val(coords.y); 
    $("#crop_w").val(coords.w); 
    return $("#crop_h").val(coords.h); 
    }; 

    return AvatarCropper; 

})(); 

// --- 
// generated by coffee-script 1.9.2

来源

2017-01-27 20:45:01

将coffeescript函数转换为javascript

回答

相关问题