কমনজেএস, এএমডি এবং প্রয়োজনীয় জেএসের মধ্যে সম্পর্ক?


840

আমি প্রচুর পড়ার পরেও কমনজেএস , এএমডি এবং প্রয়োজনীয় জেএস সম্পর্কে এখনও খুব বিভ্রান্ত ।

আমি জানি যে কমনজেএস (পূর্বে সার্ভারজেএস ) ব্রাউজারের বাইরে ভাষা ব্যবহার করা হলে কিছু জাভাস্ক্রিপ্টের নির্দিষ্টকরণ (অর্থাত মডিউল) সংজ্ঞায়নের জন্য একটি গ্রুপ is কমনজেএস মডিউলগুলির নির্দিষ্টকরণের কিছু বাস্তবায়ন রয়েছে যেমন নোড.জেএস বা রিঙ্গোজেএস , ঠিক আছে?

মধ্যে সম্পর্ক কী CommonJS , অ্যাসিঙ্ক্রোনাস মডিউল সংজ্ঞা (এএমডির) এবং RequireJS ?

কি RequireJS এর একটি বাস্তবায়ন CommonJS মডিউল সংজ্ঞা? যদি হ্যাঁ, তবে এএমডি কী ?


31
পড়া requirejs.org/docs/whyamd.html অনেক নির্মল যেমন তাদের উল্লেখ করা হবে। (আমি এটিকে পুরো উত্তর হিসাবে বিবেচনা করি না বলে এটি মন্তব্য হিসাবে পোস্ট করা)।
মেমিটিলভা

5
আমি কি আরও জিজ্ঞাসা করতে বা যুক্ত করতে পারি; কীভাবে বা কোথায় ES2015 আমদানির বিবৃতি এই সমস্তগুলির মধ্যে খাপ খায়; যেমন 'এমবার' থেকে আম্বার আমদানি করুন;
testndtv

এমন একটি সিস্টেমজ রয়েছে যা সমর্থিত জেএস মডিউল ফর্ম্যাটগুলির মতো (কমনজেএস, ইউএমডি, এএমডি, ইএস 6) লোড করে।
অ্যান্ডি

উত্তর:


770

প্রয়োজনীয় জেএস এএমডি এপিআই প্রয়োগ করে (উত্স)

কমনজেএস হ'ল একটি exportsবস্তুর সাহায্যে মডিউলগুলি সংজ্ঞায়িত করার একটি উপায় যা মডিউলের বিষয়বস্তুকে সংজ্ঞায়িত করে। সোজা কথায়, একটি কমন জেএস বাস্তবায়ন এ জাতীয়ভাবে কাজ করতে পারে:

// someModule.js
exports.doSomething = function() { return "foo"; };

//otherModule.js
var someModule = require('someModule'); // in the vein of node    
exports.doSomethingElse = function() { return someModule.doSomething() + "bar"; };

মূলত, কমনজেএস উল্লেখ করে যে আপনার require()নির্ভরতা আনার জন্য একটি ফাংশন থাকতে হবে, exportsমডিউল সামগ্রীগুলি রফতানি করার জন্য একটি পরিবর্তনশীল এবং একটি মডিউল শনাক্তকারী (যা এই মডিউলটির সাথে সম্পর্কিত মডিউলের অবস্থান বর্ণনা করে) যা নির্ভরতা ( উত্স উত্সের প্রয়োজন) ব্যবহার করার জন্য ব্যবহৃত হয় )। কমনজেএসে নোড.জেএস সহ বিভিন্ন বাস্তবায়ন রয়েছে , যা আপনি উল্লেখ করেছেন।

কমনজেএস বিশেষত ব্রাউজারগুলিকে মাথায় রেখে তৈরি করা হয়নি, সুতরাং এটি ব্রাউজারের পরিবেশে খুব ভালভাবে খাপ খায় না ( এটির সত্যিকার অর্থে আমার কোনও উত্স নেই - এটি কেবল প্রয়োজন জেএসএস সাইট সহ সর্বত্র বলেছে ) স্পষ্টতই, এর কিছু আছে অ্যাসিনক্রোনাস লোডিং ইত্যাদির সাহায্য করুন do

অন্যদিকে, প্রয়োজনীয় জেএস এএমডি প্রয়োগ করে, যা ব্রাউজার পরিবেশের ( উত্স ) অনুসারে ডিজাইন করা হয়েছে । স্পষ্টতই, এএমডি কমনজেএস ট্রান্সপোর্ট ফর্ম্যাটটির একটি স্পিন অফ হিসাবে শুরু হয়েছিল এবং তার নিজস্ব মডিউল সংজ্ঞা এপিআইতে রূপান্তরিত হয়েছিল। তাই দুজনের মধ্যে মিল রয়েছে। এএমডিতে নতুন বৈশিষ্ট্যটি হ'ল define()ফাংশন যা মডিউলটি বোঝা হওয়ার আগে তার নির্ভরতা ঘোষণা করতে দেয়। উদাহরণস্বরূপ, সংজ্ঞাটি হতে পারে:

define('module/id/string', ['module', 'dependency', 'array'], 
function(module, factory function) {
  return ModuleContents;  
});

সুতরাং, কমনজেএস এবং এএমডি হ'ল জাভাস্ক্রিপ্ট মডিউল সংজ্ঞা সংস্থাগুলি যার বিভিন্ন প্রয়োগ রয়েছে, তবে উভয়ই একই উত্স থেকে এসেছে।

  • এএমডি ব্রাউজারের জন্য আরও উপযুক্ত, কারণ এটি মডিউল নির্ভরতাগুলির অ্যাসিনক্রোনাস লোডিং সমর্থন করে।
  • RequireJS হ'ল AMD এর একটি বাস্তবায়ন, একই সময়ে একই সাথে কমনজেএসের স্পিরিট রাখার চেষ্টা করা হয় (মূলত মডিউল শনাক্তকারীদের মধ্যে)।

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

define(function(require, exports, module) {
  var someModule = require('someModule'); // in the vein of node    
  exports.doSomethingElse = function() { return someModule.doSomething() + "bar"; };
});

আমি আশা করি এটি বিষয়গুলি পরিষ্কার করতে সহায়তা করে!


7
পরীক্ষা করে দেখুন uRequire.org দুই বা সহজ <স্ক্রিপ্ট> কোন পারেন লিখতে (অথবা উভয়), স্থাপন - প্রকল্পের যে 2 ফরম্যাটের ফাঁক সেতু
Angelos Pikoulas

51
এফওয়াইআই ব্রাউজারফাই আপনাকে এখন ব্রাউজারে কমনজেএস ব্যবহার করতে দেবে।
এরুয়ান্ট

9
@ ইউরান্ট তবে এটি এখনও এএমডি-র মতো অবিস্মরণীয় প্রকৃতির নয়।
Inanc Gumus

8
প্রয়োজনীয় জেএস ডক্সে উল্লিখিত হিসাবে কমনজেএস ব্রাউজারে ফিট না হওয়ার কারণ - " কমনজেএস প্রয়োজন () একটি সিঙ্ক্রোনাস কল, এটি তাত্ক্ষণিক মডিউলটি ফেরত প্রত্যাশা করে। এটি ব্রাউজারে ভাল কাজ করে না" । আরও তথ্য এখানে
মেসেনি

4
@aaaaaa আপনি ব্যবহারকারীর অনুরোধের উপর নির্ভর করে কিছু বৈশিষ্ট্য সক্ষম করতে চাইতে পারেন; সুতরাং এএমডির অ্যাসিঙ্ক প্রকৃতি কাজে লাগতে পারে।
ইনঙ্ক গুমাস

199

কমনজেএস এর চেয়েও বেশি - এটি জাভাস্ক্রিপ্টের জন্য একটি সাধারণ এপিআই এবং ইকোসিস্টেম সংজ্ঞায়িত করার প্রকল্প। কমনজেএস এর একটি অংশ মডিউল স্পেসিফিকেশন। নোড.জেএস এবং রিঙ্গোজেএস হ'ল সার্ভার-সাইড জাভাস্ক্রিপ্ট রানটাইমস, এবং হ্যাঁ, উভয়ই কমনজেএস মডিউল স্পেকের ভিত্তিতে মডিউলগুলি প্রয়োগ করে।

এএমডি (অ্যাসিনক্রোনাস মডিউল সংজ্ঞা) মডিউলগুলির জন্য আরেকটি স্পেসিফিকেশন। প্রয়োজনীয়তা জেএস সম্ভবত এএমডির সর্বাধিক জনপ্রিয় বাস্তবায়ন। CommonJS থেকে এক প্রধান পার্থক্য হল যে এএমডির নির্দিষ্ট করে মডিউল লোড করা হয় অ্যাসিঙ্ক্রোনাস মানে মডিউল, সমান্তরাল লোড করা হয় যেমন শেষ পর্যন্ত বোঝা জন্য অপেক্ষা দ্বারা সঞ্চালনের ব্লক উল্টোদিকে -।

এএমডি সাধারণত ক্লায়েন্ট-সাইডে (ব্রাউজারে) জাভাস্ক্রিপ্ট বিকাশের কারণে বেশি ব্যবহৃত হয় এবং কমন জেএস মডিউলগুলি সাধারণত সার্ভার-সাইড ব্যবহৃত হয়। উদাহরণস্বরূপ, RequireJS অফার - তবে, আপনি হয় মডিউল বৈশিষ্ট পারেন পরিবেশে ব্যবহার করতে পারেন নির্দেশ Node.js চলমান জন্য এবং browserify একটি CommonJS মডিউল বাস্তবায়ন যে ব্রাউজারে চলে যায়।


20
কমনজেএস হোমপেজটি কেন এত ভয়ঙ্কর ... আমি কেবল অফিক্যাল স্পেকটি দেখার চেষ্টা করছি। এতে সিনট্যাক্স ত্রুটি রয়েছে, অসম্পূর্ণ ডকুমেন্টেশন রয়েছে এবং উইকি পৃষ্ঠাটি সমাধান করছে না।
টাকো

7
অ্যাসিক্রোনালি মডিউল লোড করার অর্থ এটি নয়। আপনি ডায়নামিক / অলস লোডিংয়ের কথা বলছেন। অ্যাসিঙ্কের সাহায্যে আপনি কোনও ফাইল লোড করার পরামর্শ দেন এবং তার কিছুক্ষণ পরে এটি লোডিং শেষ হয়ে গেলে এটি আবার কল করবে। সিঙ্কের সাহায্যে আপনি ফাইলটি লোড করার পরামর্শ দিন এবং তারপরে পুরো ফাইলটি লোড হওয়া শেষ না হওয়া অবধি ব্লক করবে; ফাইল লোড না হওয়া পর্যন্ত পরবর্তী কোনও কোড কার্যকর করা হয় না। প্রাক্তন অপ্রত্যাশিত খরচে আরও ভাল কর্মক্ষমতা অর্জন করতে পারে, তবে পরবর্তীকালে প্রতিবার একই ফলাফল পাওয়া যায় এবং এভাবে আরও অনুমানযোগ্য। মনে রাখবেন যে বিভিন্ন অপটিমাইজেশন ব্যবহার করে এই quirks প্রশমিত করা যেতে পারে।
পেরি 22

উত্তরের জন্য ধন্যবাদ. এখন যে মডিউলগুলি ES2015 সহ জেএসে অফিসিয়াল, এর অর্থ কি তারা এএমডি বা সাধারণ জেএসের চেয়ে বেশি উপস্থাপিত হয়?
আখয়

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

187

সংক্ষিপ্ত উত্তরটি হবে:

কমনজেএস এবং এএমডি জাভাস্ক্রিপ্ট অ্যাপ্লিকেশনগুলিতে মডিউল এবং তাদের নির্ভরতা কীভাবে ঘোষণা করা উচিত সে সম্পর্কে নির্দিষ্টকরণ (বা ফর্ম্যাট) are

আবশ্যকজেএস একটি স্ক্রিপ্ট লোডার লাইব্রেরি যা এএমডি অনুগত, কার্লজ অন্য একটি উদাহরণ।

কমন জেএস অনুগত:

অ্যাডি ওসমানীর বই থেকে নেওয়া ।

// package/lib is a dependency we require
var lib = require( "package/lib" );

// behavior for our module
function foo(){
    lib.log( "hello world!" );
}

// export (expose) foo to other modules as foobar
exports.foobar = foo;

এএমডি অনুগত:

// package/lib is a dependency we require
define(["package/lib"], function (lib) {

    // behavior for our module
    function foo() {
        lib.log( "hello world!" );
    }

    // export (expose) foo to other modules as foobar
    return {
        foobar: foo
    }
});

অন্য কোথাও মডিউলটি ব্যবহার করা যেতে পারে:

require(["package/myModule"], function(myModule) {
    myModule.foobar();
});

কিছু পটভূমি:

আসলে, কমনজেএস একটি এপিআই ঘোষণার চেয়ে অনেক বেশি এবং এর একটি অংশই এর সাথে ডিল করে। কমনজেএস তালিকায় মডিউল বিন্যাসের জন্য একটি খসড়া স্পেসিফিকেশন হিসাবে এএমডি শুরু হয়েছিল, তবে সম্পূর্ণ sensক্যমত হয় নি এবং ফর্ম্যাটটির আরও বিকাশ এমএডিজেএস গ্রুপে স্থানান্তরিত হয়েছে । আর্গুমেন্টগুলির চারপাশে আরও ভাল বলা হয়েছে যে কমন জেএস উদ্বেগের একটি বিস্তৃত সেটকে coverাকতে চেষ্টা করে এবং এটি এর সিঙ্ক্রোনাস প্রকৃতির কারণে সার্ভার পার্শ্ব বিকাশের পক্ষে আরও উপযুক্ত এবং এটিএমডি ক্লায়েন্ট সাইডের (ব্রাউজার) উন্নয়নের জন্য আরও উপযুক্ত এবং তার অ্যাসিনক্রোনাস প্রকৃতি এবং ডোজোর মডিউল ঘোষণার বাস্তবায়নে এর শিকড় রয়েছে fact

সূত্র:


1
বর্ণনার চেয়ে কোড দেখায় সহায়তা হয়! :) AMD compliantআসলে রিকোয়ারজেজেস, তাই না?
অসীম কেটি

আমি কি কিছু মিস করছি, নাকি এখানে ভুল কিছু রয়েছে? আপনি "প্যাকেজ / lib" সংজ্ঞায়িত করেন তবে তারপরে "প্যাকেজ / মাইমডিউল" প্রয়োজন।
রুলডাগ

আমি কেন সবসময় এমন কিছু হয় তার ইতিহাস সম্পর্কে কিছুটা পড়তে পছন্দ করি! যে পটভূমি প্রদান করার জন্য ধন্যবাদ!
Andru

@ রুলডগ নং, "প্যাকেজ / লিব" এখানে সংজ্ঞায়িত করা হয়নি, এটি এখানে ব্যবহৃত একটি তৃতীয় পক্ষের নির্ভরতা ।
রবার্ট সিমার

28

বরাত দিয়ে

এএমডি :

  • একটি ব্রাউজারের প্রথম পদ্ধতির
  • অ্যাসিক্রোনাস আচরণ এবং সহজতর পিছনের সামঞ্জস্যের পক্ষে বেছে নেওয়া
  • এতে ফাইল আই / ও এর কোনও ধারণা নেই।
  • এটি অবজেক্টস, ফাংশন, কনস্ট্রাক্টর, স্ট্রিং, জেএসএন এবং আরও অনেক ধরণের মডিউল সমর্থন করে।

কমনজেএস :

  • একটি সার্ভার-প্রথম পদ্ধতির
  • সমকালীন আচরণ অনুমান করা
  • আই / ও, ফাইল সিস্টেম, প্রতিশ্রুতি এবং আরও অনেক কিছু যেমন উদ্বেগের একটি বৃহত্তর সেট কভার করুন।
  • মোড়কযুক্ত মডিউলগুলি সমর্থন করে, এটি ES.next/ হারমোনি স্পেসিফিকেশনের আরও খানিকটা কাছাকাছি অনুভব করতে পারে , আপনাকে সংজ্ঞায়িত () মোড়কে জোর করে মুক্ত AMDকরে।
  • কেবলমাত্র মডিউল হিসাবে অবজেক্ট সমর্থন করে।

17

এটি বেশ কয়েক ফাইল মধ্যে এবং কল জাভাস্ক্রিপ্ট প্রোগ্রাম মডুলার সংগঠিত করার বেশ স্বাভাবিক child-modulesথেকে main js module

জিনিসটি জাভাস্ক্রিপ্ট এটি সরবরাহ করে না। ক্রোম এবং এফএফ এর সর্বশেষতম ব্রাউজার সংস্করণে আজও নয়।

তবে, জাভাস্ক্রিপ্টের কোনও কীওয়ার্ড অন্য জাভাস্ক্রিপ্ট মডিউলটি কল করার জন্য আছে?

এই প্রশ্নটি অনেকের কাছে বিশ্বের মোট পতন হতে পারে কারণ উত্তরটি হ'ল না


ইএস 5-তে (২০০৯ এ প্রকাশিত) জাভাস্ক্রিপ্টের কোনও আমদানি , অন্তর্ভুক্ত বা প্রয়োজনীয় জাতীয় কীওয়ার্ড ছিল না ।

ইএস 6 আমদানি মূলশব্দটির প্রস্তাবনা (2015 সালে প্রকাশিত) দিনটি বাঁচায় ( https://developer.mozilla.org/en/docs/Web/JavaScript/References/Statesments/import ) তবে কোনও ব্রাউজার এটি প্রয়োগ করে না।

আপনি যদি ব্যাবেল 6.18.0 ব্যবহার করেন এবং কেবল ES2015 বিকল্পের সাথে প্রতিস্থাপন করেন

import myDefault from "my-module";

আপনি requireআবার পাবেন।

"use strict";
var _myModule = require("my-module");
var _myModule2 = _interopRequireDefault(_myModule);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

এর কারণ requireহল মডিউলটি নোড.জেএস থেকে লোড হবে means নোড.জেএস মডিউলটিতে সিস্টেম লেভেল ফাইল রিড থেকে ফাংশন মোড়ানো পর্যন্ত সবকিছু পরিচালনা করবে।

কারণ জাভাস্ক্রিপ্ট ফাংশনগুলিতে মডিউলগুলির প্রতিনিধিত্বকারী একমাত্র মোড়ক।

আমি কমনজেএস এবং এএমডি সম্পর্কে অনেক বিভ্রান্ত?

কমনজেএস এবং এএমডি উভয়ই মডিউলগুলি স্মার্ট লোড করতে জাভাস্ক্রিপ্ট "ত্রুটি" কাটিয়ে উঠতে পারে কেবল দুটি ভিন্ন কৌশল।


3
আপনার উত্তরটি আপডেট করা উচিত কারণ এখন সমস্ত আধুনিক ব্রাউজার সমর্থন করে import
vsync

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