ECMAScript ব্যবহার 6

Question

আমি আমার ব্রাউজারের কনসোলে ECMAScript 6 কোড চালানোর জন্য একটি উপায় খুঁজছি তবে বেশিরভাগ ব্রাউজারগুলি আমি যে কার্যকারিতাটি সন্ধান করছি তা সমর্থন করে না। উদাহরণস্বরূপ ফায়ারফক্স একমাত্র ব্রাউজার যা তীর ফাংশন সমর্থন করে।

আমি কি Chrome এ এই বৈশিষ্ট্যগুলি চালাতে পারি এমন কোনও উপায় (এক্সটেনশন, ইউজারস্ক্রিপ্ট ইত্যাদি) আছে?

Answer 1

Chrome এ, বেশিরভাগ ES6 বৈশিষ্ট্যগুলি "পরীক্ষামূলক জাভাস্ক্রিপ্ট বৈশিষ্ট্যগুলি" নামে একটি পতাকার পিছনে লুকানো থাকে। দেখুন chrome://flags/#enable-javascript-harmony, এই পতাকাটি সক্ষম করুন , ক্রোম পুনরায় চালু করুন এবং আপনি অনেকগুলি নতুন বৈশিষ্ট্য পাবেন ।

V8 / Chrome এ তীর ফাংশনগুলি এখনও প্রয়োগ করা হয়নি , সুতরাং এই পতাকাটি তীর ফাংশনগুলিকে "আনলক করবে না"।

যেহেতু তীর ফাংশনগুলি একটি সিনট্যাক্স পরিবর্তন, জাভাস্ক্রিপ্টটিকে পার্স করার পদ্ধতি পরিবর্তন না করেই এই সিনট্যাক্সটিকে সমর্থন করা সম্ভব নয়। আপনি যদি ES6 তে বিকাশ করতে পছন্দ করেন তবে আপনি ES6 কোড লিখতে এবং জাভাস্ক্রিপ্ট কোড তৈরি করতে একটি ES6-to-ES5 সংকলক ব্যবহার করতে পারেন যা সমস্ত বিদ্যমান (আধুনিক) ব্রাউজারগুলির সাথে সামঞ্জস্যপূর্ণ।

উদাহরণস্বরূপ, https://github.com/google/traceur-compiler দেখুন । লেখার মতো এটি ইএস 6 এর নতুন সিনট্যাক্স বৈশিষ্ট্যগুলির সমস্ত সমর্থন করে । এই উত্তরের শীর্ষে উল্লিখিত পতাকার সাথে একসাথে আপনি পছন্দসই ফলাফলের খুব কাছাকাছি পাবেন।

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

Comments

ক্রোমের জন্য একটি স্ক্র্যাচজেএস, একটি দেব সরঞ্জামও রয়েছে

— পিক্সেল 67

ক্রোমের সর্বশেষ সংস্করণে তীর ফাংশনগুলি সম্পূর্ণরূপে প্রয়োগ করা হয়েছে। যদিও এই টিপটি অন্যান্য ইএস 6 বৈশিষ্ট্যের জন্য কার্যকর থাকে। classউদাহরণস্বরূপ সিনট্যাক্সের মতো ।

— অ্যাডাম ব্রাউন

এই উত্তরটি এখন বেশিরভাগ পুরানো।

— মিশা পেরেকোভস্কি

@ গথডো স্পেসিফিকেশনগুলি প্রকৃতপক্ষে পুরানো (এ দিনগুলিতে তীর ফাংশনগুলি ভালভাবে সমর্থিত) তবে পরীক্ষামূলক জেএস ফাংশনগুলি সক্ষম করার জন্য সাধারণ পরামর্শটি এখনও সত্য। উদাহরণস্বরূপ, নিয়মিত অভিব্যক্তিতে লুক-ব্যাকগুলি ডিফল্টরূপে অক্ষম থাকে। --enable-javascript-harmonyপতাকাটি সেট করা থাকলে নিম্নলিখিতটি মিথ্যা প্রত্যাবর্তন করবে : /(?<!a)b/.test('ab')(এবং পতাকাটি সেট না করা থাকলে পরবর্তী ত্রুটি নিক্ষেপ করুন: "আনকচড সিনট্যাক্স এরিয়ার: অবৈধ নিয়মিত অভিব্যক্তি: / (? <! A) গ্রুপ /)

— রব ডব্লু

এটি পুরানো নয়, উইন্ডোটির পুরাতন সংস্করণ সহ ক্লায়েন্টের সাথে তীর_ফানকশনগুলির সাথে একই সমস্যা ছিল । পতাকাটি কৌতুক করেছিল, ধন্যবাদ!

— জাইমে ইউলে

Answer 2

বাবেল ES6 চেষ্টা করে দেখতে দুর্দান্ত ট্রান্সপেলার। আপনি তাদের ওয়েবসাইটের "এটি ব্যবহার করে দেখুন" বিভাগে ব্রাউজারে ES6 চালাতে পারেন। এটি jsfiddle একই কাজ করে।

উদাহরণস্বরূপ তীরগুলি:

let add = (x,y) => x + y;
let result = add(1,1);
console.log(result);

ফলাফল প্রদর্শন করে 2 ।

বাবেল "ট্রান্সপ্লাইলস", এটি ES6 কে ES5 জাভাস্ক্রিপ্টে অনুবাদ করে যা বর্তমান ব্রাউজার প্রযুক্তি দ্বারা চালিত হতে পারে। আপনি বাবেলের মাধ্যমে ইনস্টল করতে পারেন npm install -g babel। একবার ইনস্টল হয়ে গেলে আপনি উপরের তীরের উদাহরণটি একটি ফাইলে সংরক্ষণ করতে পারেন। বলুন আমরা "ES6.js" ফাইলটি কল করি। ধরে নিই আপনার নোড ইনস্টল করা আছে তারপর কমান্ড লাইনে পাইপ আউটপুট নোড:

babel ES6.js | node

এবং আপনি আউটপুট দেখতে পাবেন 2। কমান্ডটি দিয়ে আপনি অনূদিত ফাইলটি স্থায়ীভাবে সংরক্ষণ করতে পারেন:

babel ES6.js --out-file output.js

আউটপুট.জেএস "ট্রান্সপ্লাইড":

"use strict";

var add = function (x, y) {
  return x + y;
};

var result = add(1, 2);

console.log(result);

যে কোনও আধুনিক ব্রাউজারে অবশ্যই চালানো যায়।

ক্লাস ব্যবহার করে উদাহরণ

ES6 একটি দ্রুত চলন্ত লক্ষ্য। পড়ুন সামঞ্জস্যের ছক যেমন Traceur এবং হট্টগোল এবং ব্রাউজার সমর্থন হিসেবে transpilers দ্বারা সমর্থিত বৈশিষ্ট্য খুঁজে বের করা। আপনি সামঞ্জস্যতা যাচাই করতে ব্যবহৃত পরীক্ষাটি দেখতে চার্টটি প্রসারিতও করতে পারেন:

একটি ব্রাউজারে রক্তপাত প্রান্ত ES6 চেষ্টা করার জন্য ফায়ারফক্স নাইট বিল্ড বা Chrome রিলিজ চ্যানেল ব্যবহার করে দেখুন

Comments

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

— কেভিন ডাইস

উবুন্টু 17,04, আমি যা করতে হবে sudo npm install -g --save-dev babel-cli babel-preset-es2015এবং $(npm bin)/babel ES6.js --presets es2015তা কার্যকর করতে, আরএফ babeljs.io/docs/plugins/preset-es2015

— ফলের

Answer 3

আপনি সম্ভবত নিম্নলিখিত লিঙ্কগুলির একটি সন্ধান করছেন:

হট্টগোল ( Webpack জন্য , Gulp জন্য , ঘোঁৎ ঘোঁৎ জন্য , অন্যান্য অবকাঠামো ও ভাষার জন্য )

আপনার বিকাশ পাইপলাইনে বাবেল ব্যবহার করা স্বয়ংক্রিয়ভাবে আপনার জাভাস্ক্রিপ্ট ক্রস ব্রাউজারের সাথে সামঞ্জস্যপূর্ণ হয়ে উঠবে (রূপান্তরিত হবে)) অথবা, আপনি যদি টাইপস্ক্রিপ্ট ব্যবহার করছেন তবে আপনি সহজেই বিশ্রাম নিতে পারেন; আপনার কোডটি ইতিমধ্যে স্থানান্তরিত হচ্ছে।

---

কোনও ট্রান্সপ্লেলার সেটআপ করতে চান না (যেমন বাবেল / টাইপসক্রিপ্ট), বা আপনি কি এখনও আপনার ট্রান্সপেলার দ্বারা সমর্থিত নয় এমন বৈশিষ্ট্যগুলি নিয়ে খেলতে চান?

আপনি ক্রোম: // ফ্ল্যাগ / # সক্ষম-জাভাস্ক্রিপ্ট-সম্প্রীতি এবং জাভাস্ক্রিপ্ট হারমোনি পতাকা সক্ষম করে আপনার ব্রাউজারে পরীক্ষামূলক ECMAScript বৈশিষ্ট্য সক্ষম করতে পারবেন । কিছু বৈশিষ্ট্যের জন্য, আপনাকে জাভাস্ক্রিপ্ট হারমোনি পতাকা সক্ষম করার সাথে ক্রোম ক্যানারি ব্যবহার করতে হতে পারে ।

নতুন জাভাস্ক্রিপ্ট এপিআইগুলি সাধারণত বাবেল দ্বারা আচ্ছাদিত হয় না এবং তাদের নিজস্ব ক্রোম পতাকা থাকবে।

তীর ফাংশন ব্যবহার করে

এই প্রশ্নটিতে তীর ফাংশনগুলি ব্যবহার করে বিশেষভাবে উল্লেখ করা হয়েছে। আইરો এবং অপেরা মিনি ব্যতীত এখন অ্যারো ফাংশনগুলি সমস্ত ব্রাউজারে নেটিভলি সমর্থিত। ক্যানিউজ দেখুন ।

আপনি যদি তীরের ফাংশনগুলি নিয়ে খেলতে চান তবে এটি কিছুটা কঠিন হয়ে পড়েছিল। নীচের ইতিহাসটি এই বৈশিষ্ট্যটির সাথে খেলতে সময় বিভিন্ন পয়েন্টে কী নিয়েছিল তা দেখায়।

1) প্রথমদিকে, তীর ফাংশনগুলি কেবল Chromechrome://flags/#enable-javascript-harmony সক্ষম করে ক্রম ক্যানারিতে কাজ করেছিল । দেখে মনে হচ্ছে এই কার্যকারিতাটি 39 সংস্করণ দ্বারা কমপক্ষে আংশিকভাবে প্রয়োগ করা হয়েছিল।

2) তারপরে, গুগল ক্রোমে জাভাস্ক্রিপ্ট হারমোনি পতাকার পিছনে উপলব্ধ তীর ফাংশন ।

3) এবং অবশেষে, গুগল ক্রোম 45-এ , তীর ফাংশনগুলি যেখানে ডিফল্টরূপে সক্ষম হয়।

অন্যান্য নতুন ECMAScript বৈশিষ্ট্যগুলির সাথে একই ধরণের ঘটনার প্রত্যাশা আপনি করতে পারেন।

Comments

টাইপস্ক্রিপ্ট একটি দুর্দান্ত ট্রান্সফেলার নিয়ে আসে। বাবেল একটি সাধারণ জাভাস্ক্রিপ্ট ট্রান্সপোর্টারও। আপনি যদি আপনার এস code কোডটি এসএসের নিচে স্থানান্তরিত করেন তবে আপনাকে এস of এর দুর্দান্ততার ব্যবহার শুরু করতে ব্রাউজার সমর্থনটির জন্য অপেক্ষা করতে হবে না!

— wp-overwatch.com

Answer 4

বন্ধ করার জন্য কেবল কঠোর মোড ব্যবহার করুন (প্রয়োজন নেই, তবে এটি দুর্দান্ত পদ্ধতির) এবং Chrome আপনার কোডটি ES6 হিসাবে কার্যকর করতে সক্ষম হবে ...

(function(){
  'use strict';
  //your ES6 code...
})();

এখানে একটি উদাহরণ ... http://jsbin.com/tawubotama/edit?html,js,console , আউটপুট স্ট্রিক মোড লাইনটি সরানোর চেষ্টা করুন , এবং আবার চেষ্টা করুন, কনসোলে একটি ত্রুটি লগ হয়ে যাবে।

Answer 5

২০১৫ সালের নভেম্বর পর্যন্ত ফায়ারফক্স এবং এজ ES6 ঘোড়দৌড়ের নেতৃত্ব দিচ্ছে, আপনি যদি ক্রোমের অভাবের ফাংশনগুলি পরীক্ষা করতে চান তবে সেগুলি ব্যবহার করুন। প্রান্তে ক্লাস / সাবক্লাস রয়েছে এবং ফায়ারফক্সের প্রক্সি রয়েছে ; তাদের মধ্যে আপনার কার্যত সমস্ত ES6 বৈশিষ্ট্য রয়েছে ।

আপনার যদি অবশ্যই ক্রোম কনসোলে ES6 ব্যবহার করতে পারেন তবে একটি সহজ, চেষ্টা করা এবং সত্য উপায় রয়েছে:

ধৈর্য্য ধারন করুন.

ব্রাউজারগুলি ES6 গ্রহণ করছে - এমনকি সাফারি, যিনি বেশিরভাগ এইচটিএমএল 5 স্ট্যান্ডার্ডে পা টেনে নিচ্ছেন। গুগলকে সময় দিন এবং তারা একে একে ES6 বৈশিষ্ট্যগুলি প্রয়োগ করবেন। উদাহরণস্বরূপ, তীর ফাংশনগুলি এখন উত্পাদন চ্যানেলে এবং পতাকা ছাড়াই উপলব্ধ।

এক্সটেনশন আশা করবেন না; আপনি ইএস 6 লাইন ইএস 5 লাইন অনুবাদ করতে পারবেন না, তাই আমরা কেবল বাবেলের সাথে কনসোল প্রসারিত করতে পারি না ।

এটি সত্য যে একটি পরীক্ষামূলক জেএস পতাকা রয়েছে, তবে এটি ভাল কারণে বিদ্যমান। ভি 8-তে প্রক্সি রয়েছে তবে পুরানো (অ-মানক) সিনট্যাক্সে রয়েছে এবং সুরক্ষার সমস্যা রয়েছে । এর ধ্বংসাত্মকটিও অসম্পূর্ণ: আপনি দেখতে পাবেন যে কোনও ক্ষেত্রে এটি কাজ করে, যদি আসে তবে এটি কাজ করে না।

আপনি যদি কেবল ES6 খেলতে চান তবে কেবল এজ / ফায়ারফক্সের সাথে খেলুন। তারা উভয়ই প্রায় পুরো বাবেলকে কভার করে, কনসোল এবং ডিবাগার রয়েছে এবং এমন বৈশিষ্ট্য রয়েছে যা বাবেল সরবরাহ করতে পারে না।

Comments

সাফারি আসলে সমস্ত ডেস্কটপ ব্রাউজারের চেয়ে এগিয়ে এবং ইএস 6 সমর্থনে আইওএস 10 মোবাইল অ্যান্ড্রয়েডের জন্য ক্রোমের চেয়ে এগিয়ে। kangax.github.io/compat-table/es6

— লুই দুরান

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

— শেপি