আমি jQuery প্লাগইন সিনট্যাক্স বুঝতে চাই


89

JQuery সাইট jQuery এর জন্য প্রাথমিক প্লাগইন সিনট্যাক্সটি তালিকাভুক্ত করে:

(function( $ ){    
  $.fn.myPlugin = function() {      
    // there's no need to do $(this) because
    // "this" is already a jquery object

    // $(this) would be the same as $($('#element'));

    this.fadeIn('normal', function(){    
      // the this keyword is a DOM element    
    });    
  };
})( jQuery );

আমি জাভাস্ক্রিপ্টের দৃষ্টিকোণ থেকে সেখানে কী চলছে তা বুঝতে চাই, কারণ জেএস এর আগে আমি যে কোনও বাক্য গঠন দেখেছি তা এটি দেখে মনে হচ্ছে না। সুতরাং এখানে আমার প্রশ্নের তালিকা:

  1. আপনি যদি ভেরিয়েবলের সাথে ফাংশন ($) ... প্রতিস্থাপন করেন, "the_function" বলুন, সিনট্যাক্সটি দেখতে এরকম দেখাচ্ছে:

     (the_function)( jQuery );
    

    "(JQuery) কি"; করছেন? _পরিষ্কারের আশেপাশে প্রথম বন্ধনীগুলি কি সত্যিই প্রয়োজনীয়? তারা সেখানে কেন? কোডের অন্য একটি অংশ যা আপনি দিতে পারেন তা কি একই রকম?

  2. এটি ফাংশন ($) দিয়ে শুরু হয়। সুতরাং এটি একটি ফাংশন তৈরি করছে, যতদূর আমি বলতে পারি যে কখনই চালানো হবে না $ এর পরামিতিটি, যা ইতিমধ্যে সংজ্ঞায়িত? সেখানে কি চলছে?

সাহায্যের জন্য ধন্যবাদ!

উত্তর:


130
function(x){ 
    x...
}

নাম ব্যতিরেকে কেবল একটি ফাংশন, এটি একটি যুক্তি "x" নেয় এবং এক্স দিয়ে কাজ করে।

'এক্স' এর পরিবর্তে, যা একটি সাধারণ পরিবর্তনশীল নাম, আপনি $ ব্যবহার করতে পারেন যা একটি কম সাধারণ পরিবর্তনশীল নাম, তবে এখনও আইনী।

function($){ 
    $...
}

এটি একটি এক্সপ্রেশন হিসাবে পার্স করে তা নিশ্চিত করার জন্য আমি এটি বন্ধনীগুলিতে রেখে দেব:

(function($){
    $....
})

একটি ফাংশন কল করতে, আপনি () এর পরে যুক্তিগুলির তালিকা সহ রেখেছেন put উদাহরণস্বরূপ, আমরা যদি এই ফাংশনটি 3 এর পাশ দিয়ে কল করতে চাই তবে $আমরা এটি করব:

(function($){
    $...
})(3);

কেবল কিক্সের জন্য, আসুন এই ফাংশনটি কল করুন এবং ভেরিয়েবল হিসাবে jQuery এ পাস করুন:

(function($){
     $....
})(jQuery);

এটি একটি নতুন ফাংশন তৈরি করে যা একটি যুক্তি নেয় এবং তারপরে সেই ফাংশনটিকে কল করে, jQuery এ মান হিসাবে পাস করে।

কেন?

  • কারণ প্রতিবার jQuery লেখার জন্য আপনি jQuery দিয়ে কিছু করতে ক্লান্তিজনক is

কেন শুধু লেখেন না $ = jQuery?

  • কারণ অন্য কেউ সংজ্ঞায়িত করেছেন mean অন্যরকম কিছু বোঝাতে। এটি গ্যারান্টি দেয় যে $ এর অন্য কোনও অর্থ এর দ্বারা ছায়াযুক্ত।

20
এটা স্পষ্ট, কিন্তু এটি একটি যেমন ফাংশন সংজ্ঞা পার্স মধ্যে পার্সার গাইড করার প্রয়োজনীয়তা উপর একটি বিবরণাদি অনুপস্থিত অভিব্যক্তি এবং না একটি বিবৃতিঅতিরিক্ত বন্ধনীগুলির জন্য এটিই ।
পয়েন্টটি

16
(function(){})()আইআইএফই (তাত্ক্ষণিকভাবে অনুরোধ করা ফাংশন এক্সপ্রেশন) হিসাবে পরিচিত । যাক এটা পরিচিত হবে যে আপনি এমন হিসাবে একটি অভিব্যক্তি হিসাবে ফাংশন চিকিত্সা পার্সার বলপূর্বক অন্য চিহ্ন ব্যবহার করতে পারেন +,!,-,~এই মত (এবং অন্যদের): !function($){}(jQuery)। এবং আরও মজাদার জন্য আপনি করতে পারেন ~~+-!function($){}(jQuery):!
ডেভিড মারডোক

(ফাংশন ($, উইন, ডক) {$ ....}) (jQuery, উইন্ডো, নথি); আমি এটিও যুক্ত করব ... এটি আমাকে আরও ভালভাবে বুঝতে সাহায্য করেছিল। কোডের এই শান্তিতে, jQuery ---> $; এবং উইন্ডো ---> জয়; তারপরে ডকুমেন্ট ---> ডক ... :) ধন্যবাদ ...
হারাণধ

আমি একটি কোডের নমুনার মুখোমুখি হয়েছি যা উপরের তালিকায় আইএমএইচও আচ্ছাদিত নয়: $ (ফাংশন () {..... j (jQuery)); (এখান থেকে নেওয়া: ডকস.মাইক্রোসফটকম / en-us / aspnet / core / mvc / models/… )। এখানে, আমি of এর ব্যবহার বুঝতে পারি না $ এটি কোনও jQuery নির্বাচনকারী $ (...) বা 'নথি প্রস্তুত' ইভেন্টের জন্য একটি সংক্ষিপ্ত বাক্য গঠন বলে মনে হচ্ছে না কারণ ফাংশনটি কিছুই দেয় না। আমি ফাংশনটিকে একটি অভিব্যক্তি হিসাবে বিবেচনা করার জন্য একটি উপসর্গ বলে মনে করি না কারণ এটি বন্ধনীগুলির বাইরে outside আরও, ফাংশন কলটি বন্ধনীগুলির মধ্যে করা হয়, তাই আমরা ঘোষণাকে কল করছি।
সিচ

35

(function( $ ){

})( jQuery );

এটি আত্ম-সম্পাদনকারী বেনামি ফাংশন যা $যুক্তি হিসাবে ব্যবহার করে যাতে আপনি এটি ব্যবহার করতে পারেন ( $) পরিবর্তে jQueryসেই ফাংশনের অভ্যন্তরে এবং অন্য লাইব্রেরির সাথে বিরোধের ভয় ছাড়াই কারণ অন্যান্য গ্রন্থাগারেও $এর বিশেষ অর্থ রয়েছে। JQuery প্লাগইন লেখার সময় এই প্যাটার্নটি বিশেষভাবে কার্যকর।

আপনি এখানে পরিবর্তে কোনও চরিত্র লিখতে পারেন $:

(function(j){
  // can do something like 
  j.fn.function_name = function(x){};

})(jQuery);

এখানে jস্বয়ংক্রিয়ভাবে শেষে jQuery নির্দিষ্ট করা হবে (jQuery)। অথবা আপনি যুক্তিটি পুরোপুরি ছেড়ে দিতে পারেন তবে তার পরে সংঘর্ষের আশঙ্কার jQueryপরিবর্তে আপনাকে চারদিকে কীওয়ার্ডটি ব্যবহার করতে হবে $। তাই $সংক্ষিপ্ত সরাসরি জন্য যুক্তি জড়িয়ে রাখা হয়েছে, যাতে করে আপনি লিখতে পারেন $পরিবর্তে jQueryযে ফাংশন ভিতরে সবদিকে।

আপনি যদি jQuery এর উত্স কোডটিও দেখে থাকেন তবে আপনি দেখতে পাবেন যে সবকিছুই এর মধ্যে আবৃত রয়েছে:

(function( window, undefined ) {
  // jQuery code
})(window);

এটি আর্গুমেন্ট সহ একটি স্ব-কার্যকরকারী বেনাম ফাংশন হিসাবে দেখা যায়। একটি window(এবং undefined) যুক্তি তৈরি করা windowহয় এবং নীচে বিশ্বব্যাপী অবজেক্টের সাথে ম্যাপ করা হয় (window)। এটি আজকাল জনপ্রিয় প্যাটার্ন এবং এটির গতি খুব সামান্য রয়েছে কারণ এখানে windowবিশ্বব্যাপী windowঅবজেক্টের চেয়ে যুক্তিটি বিবেচনা করা হবে যা নীচে ম্যাপ করা হয়েছে।


এটি $.fnহল jQuery এর অবজেক্ট যেখানে আপনি আপনার নতুন ফাংশন তৈরি করেন (যা একটি বস্তুও) বা নিজেই প্লাগইন তৈরি করে যাতে jQuery আপনার প্লাগইনটিকে তার $.fnবস্তুতে আবৃত করে এবং উপলভ্য করে তোলে।


মজার বিষয় হল, আমি এখানে অনুরূপ প্রশ্নের উত্তর দিয়েছি:

জাভাস্ক্রিপ্ট / jQuery ক্লোজার ফাংশন সিনট্যাক্স

আমি লিখেছিলাম স্ব-সম্পাদনকারী কার্যাদি সম্পর্কে আরও জানতে আপনি এই নিবন্ধটিও পরীক্ষা করে দেখতে পারেন:

জাভাস্ক্রিপ্ট স্ব-সম্পাদনকারী কার্যাদি


সুতরাং আমার যদি আমার_বজেক্ট নামে একটি অবজেক্ট থাকে এবং এটি করে: (ফাংশন (মো) {মো.ডোসোমিংথিং ()}) (মাই_বজেক্ট), তবে এটি আমার_বজেক্ট.ডো কিছু () চালাবে?
ইথান

3

বেসিক প্লাগইন সিনট্যাক্স আপনাকে প্লাগইনটি লোড হওয়ার সময় সনাক্ত না করেই আপনার প্লাগিনের শরীরে $উল্লেখ করতে দেয় । এটি অন্যান্য লাইব্রেরির সাথে নামকরণের বিরোধগুলি প্রতিরোধ করে, বিশেষত প্রোটোটাইপ।jQuery$

সিনট্যাক্সটি এমন একটি ফাংশন সংজ্ঞায়িত করে যা কোনও পরামিতি হিসাবে পরিচিত হিসাবে গ্রহণ করে $যাতে আপনি $এটি ফাংশন বডি হিসাবে উল্লেখ করতে পারেন এবং তারপরে তত্ক্ষণাত jQueryযুক্তি হিসাবে রেখে ফাংশনটিকে অনুরোধ করেন।

এটি গ্লোবাল নেমস্পেসকে দূষিত করতে সহায়তা করে না (সুতরাং var myvar = 123;আপনার প্লাগইন বডিটিতে হঠাৎ সংজ্ঞায়িত হবে না window.myvar), তবে মূল অজ্ঞাতনামা হ'ল সেই জায়গাটি $যেখানে আপনাকে $পুনরায় সংজ্ঞায়িত করা হয়েছে সেখানে ব্যবহারের অনুমতি দেওয়া ।


3

আপনি সেখানে একটি স্ব-চালিত বেনাম ফাংশন নিয়ে কাজ করছেন। এটি সুনির্দিষ্ট বস্তুর সাথে $আবদ্ধ কিনা তা নিশ্চিত করার জন্য এই জাতীয় ফাংশনটির মধ্যে একটি jQuery প্লাগইন মোড়ানো "সেরা অনুশীলন" এর মতো jQuery

উদাহরণ:

(function(foo) {
    alert(foo);
}('BAR'));

BARকোনও <script>ব্লকে রাখলে এটি সতর্ক হবে । প্যারামিটারটি BARফাংশনে চলে যায় যা নিজে কল করে।

একই কোডটি আপনার কোডে ঘটছে, jQueryঅবজেক্টটি ফাংশনে প্রেরণ করা হয়েছে, সুতরাং $নিশ্চিতভাবে jQuery অবজেক্টটি উল্লেখ করবে।


4
আমি সব বুঝতে পারি। আমি যা জানতে চাই তা হল / কেন বন্ধনী সিনট্যাক্স একটি স্ব সম্পাদনকারী ফাংশন তৈরি করতে কাজ করে? এটি কি ভাষার একটি বৈশিষ্ট্য? এটা কিভাবে কাজ করে?
মাংস

2

শেষে jQuery নিজেই (jQuery) ফাংশনে চলে যায়, যাতে আপনি নিজের প্লাগইনের মধ্যে $ চিহ্নটি ব্যবহার করতে পারেন। আপনিও করেন

(function(foo){

  foo.fn.myPlugin = function() {


    this.fadeIn('normal', function(){


    });

  };
})( jQuery );

2

এটি এবং অন্যান্য আধুনিক জাভাস্ক্রিপ্ট কৌশল এবং সাধারণ অনুশীলনের স্পষ্ট ব্যাখ্যা খুঁজতে, আমি জাভাস্ক্রিপ্ট বাগান পড়ার পরামর্শ দিচ্ছি।

http://bonsaiden.github.com/ জাভা স্ক্রিপ্ট- গার্ডেন /

এটি বিশেষত দরকারী, কারণ এই ধরণের অনেকগুলি বহু লাইব্রেরিতে বিস্তৃতভাবে ব্যবহৃত হয় তবে প্রকৃতভাবে ব্যাখ্যা করা হয় না।


2

এখানে অন্যান্য উত্তরগুলি দুর্দান্ত, তবে একটি গুরুত্বপূর্ণ বিষয় রয়েছে যা লক্ষ্য করা যায় নি। তুমি বলো:

সুতরাং এটি একটি ফাংশন তৈরি করছে, যতদূর আমি বলতে পারি যে কখনই চালানো হবে না $ এর পরামিতিটি, যা ইতিমধ্যে সংজ্ঞায়িত?

গ্লোবাল ভেরিয়েবল $উপলব্ধ যে কোনও গ্যারান্টি নেই । ডিফল্টরূপে, jQuery গ্লোবাল স্কোপে দুটি ভেরিয়েবল তৈরি করে: $এবং jQuery(যেখানে দুটি একই বস্তুর জন্য এলিয়াস)। তবে jQuery নো কনফ্লিক্ট মোডেও চালানো যেতে পারে :

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
  jQuery.noConflict();
</script>

আপনি যখন কল করবেন তখন jQuery.noConflict()গ্লোবাল ভেরিয়েবলটি $jQuery লাইব্রেরি অন্তর্ভুক্ত করার আগে যা ছিল তা ফিরে আসবে। এটি jQuery কে অন্যান্য জাভাস্ক্রিপ্ট লাইব্রেরিগুলির সাথেও ব্যবহার করার অনুমতি দেয়$ বৈশ্বিক চলক ।

আপনি যদি এমন একটি প্লাগইন লিখেছেন যা $jQuery জন্য একটি উপাধি হিসাবে নির্ভর করে , তবে আপনার প্লাগইনটি NoConflict মোডে চলমান ব্যবহারকারীদের জন্য কাজ করবে না।

যেমন অন্যরা ইতিমধ্যে ব্যাখ্যা করেছে, আপনার পোস্ট করা কোড একটি বেনাম ফাংশন তৈরি করে যা অবিলম্বে কল করা হয়। jQueryএরপরে গ্লোবাল ভেরিয়েবলটি এই বেনাম ফাংশনে স্থানান্তরিত হয় যা ফাংশনের মধ্যে স্থানীয় ভেরিয়েবল হিসাবে নিরাপদে aliised হয় $

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.