2016-07-22 12 views
9

Postępuję zgodnie z tym railscastem https://www.youtube.com/watch?v=ltoPZEzmtJA, ale nie używam coffeescript. Próbuję przekonwertować coffeescript na javascript, ale mam problem.Konwertuj funkcję coffeescript na 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 plik

$(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) 

}); 

I nie rozumiem, dlaczego zdecydował się na klasę i pomyślałem, że byłoby bardziej skomplikowane, aby przekształcić całość rzecz. Problem, który mam, to funkcja aktualizacji. Właśnie podłączyłem jego skrypt do kawy do funkcji aktualizacji do konwertera i użyłem wyjścia. Powoduje to błąd informujący, że aktualizacja nie została zdefiniowana. Gdzie się mylę?

Również pytanie dodatkowe: jaki jest sens tworzenia tutaj lekcji?

Dzięki!

+1

Można używać tego konwertera http://js2.coffee/ –

+0

„Dlaczego do korzystania z zajęć, kiedy możesz pisać w C! " – metalim

+0

Czytałem Javascript dobre części i "konstruować metodę klasy" jest tam promowana z przewagą prywatności, tj. Wystawiania mniej właściwości obiektu – engineerDave

Odpowiedz

7

Twoja składnia wygląda źle ... : służy do deklarowania oznaczonych instrukcji.

To jest poprawny sposób. Deklaruje zmienną podniesioną i przypisuje funkcję ref. do tego. Nazwa funkcji może również występować w wyrażanych funkcjach, więc może odnosić się do niej bezpośrednio za pomocą jej nazwy.

Zmienna funkcji powinna zostać podniesiona, oprócz wartości przyporządkowania.

/* 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); 
} 
+0

przykro mi, że mój kod był błędny, coord ma być x, y, w, h Zmienię to. Przetopiłem to źle – user4584963

+0

@ user4584963 Zrobiłem ... – Hydro

+0

także, w railscastu on zrobił punkt, by powiedzieć, że on używa grubej strzały.. coś o kontekście, nie jestem pewien co to znaczy. Czy twoja odpowiedź to wyjaśnia? – user4584963

2

Punktem klasy:

  • uczynić go bardziej łatwe do uruchomienia tego samego zadania wielokrotnie na różnych elementów z mniejszym pokoju do kolizji.
  • pomóc psychicznie zorganizować kod

Aby przekonwertować, użyj strony jak 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 
Powiązane problemy