जावास्क्रिप्ट

Question

पर कॉफ़ीस्क्रिप्ट फ़ंक्शन को कनवर्ट करें मैं इस रेलवेस्ट https://www.youtube.com/watch?v=ltoPZEzmtJA का पालन कर रहा हूं लेकिन मैं कॉफ़ीस्क्रिप्ट का उपयोग नहीं करता हूं। मैं कॉफ़ीस्क्रिप्ट को जावास्क्रिप्ट में बदलने की कोशिश कर रहा हूं लेकिन मैं एक समस्या में भाग रहा हूं।

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) 

}); 

मैं समझ में नहीं आया कि क्यों वह एक वर्ग बनाने का फैसला किया और सोचा कि यह पूरे कन्वर्ट करने के लिए और अधिक जटिल हो जाएगा चीज़। मेरे पास जो समस्या है वह अद्यतन फ़ंक्शन है। मैंने बस एक कनवर्टर में अद्यतन फ़ंक्शन के लिए अपनी कॉफी स्क्रिप्ट प्लग की और आउटपुट का उपयोग किया। यह एक त्रुटि उत्पन्न कर रहा है कि अद्यतन परिभाषित नहीं किया गया है। मुझसे कहां गलती हो रही है?

इसके अलावा बोनस प्रश्न: यहां कक्षा बनाने का क्या मतलब है?

धन्यवाद!

Answer 1

आपका वाक्यविन्यास गलत दिखता है ... : लेबल किए गए बयान घोषित करने के लिए उपयोग किया जाता है।

यह एक सही तरीका है। एक घुमावदार चर घोषित करता है और एक समारोह रेफरी असाइन करें। इसके लिए फ़ंक्शन का नाम व्यक्त कार्यों में भी दिखाई दे सकता है, इसलिए यह अपने नाम का उपयोग करके जानबूझ कर संदर्भित कर सकता है।

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

Answer 2

एक वर्ग के बिंदु:

• इसे और अधिक आसान टकराव के लिए कम कमरे के साथ विभिन्न तत्वों पर एक ही काम के लिए कई बार चलाने के लिए करते हैं।
• मानसिक रूप से मदद करने के लिए व्यवस्थित अपने कोड

बदलने के लिए, की तरह 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