将coffeescript函数转换为javascript

Convert coffeescript function to javascript

本文关键字：javascript 转换 函数 coffeescript      更新时间：2023-09-26

我正在关注这篇文章https://www.youtube.com/watch?v=ltoPZEzmtJA但我不使用咖啡脚本。我正试图将coffeescript转换为javascript，但遇到了一个问题。

咖啡脚本

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)  
});

我不明白他为什么决定上课，并认为转换整个课程会更复杂。我遇到的问题是更新功能。我只是把他更新函数的coffee脚本插入到一个转换器中，然后使用输出。这导致了一个错误，称未定义更新。我哪里错了？

还有一个额外的问题：他在这里上课有什么意义？

谢谢！

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

这是一种正确的方式。声明一个已提升的变量，并为其分配一个函数引用。函数名称也可以出现在表达的函数中，因此它可以使用名称初始引用自己。

使用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);
}

类的点：

  • 使在不同元素上多次运行同一任务变得更加容易，碰撞的空间更小
  • 帮助在心理上组织代码

要转换，请使用以下网站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
相关文章：