ES6 কি এবং জাভাস্ক্রিপ্ট প্রোগ্রামারদের কি জানা দরকার

ES6 ECMA স্ক্রিপ্ট প্রোগ্রামিং ভাষার সংস্করণ 6 বোঝায়। ECMA স্ক্রিপ্ট জাভাস্ক্রিপ্টের জন্য মানসম্মত নাম, এবং সংস্করণ 6 সংস্করণ 5 এর পরের সংস্করণ, যা ২০১১ সালে প্রকাশিত হয়েছিল। এটি জাভাস্ক্রিপ্ট ভাষার একটি বড় বর্ধন, এবং আরও অনেক বৈশিষ্ট্য যুক্ত করে যা বৃহত্তর সফটওয়্যার ডেভেলপমেন্টকে সহজতর করার উদ্দেশ্যে ।

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

---

---

আসুন এখন ES6 জাভাস্ক্রিপ্টে কিছু বড় পরিবর্তন নিয়ে আসি।

1. ধ্রুবক

অবশেষে ধ্রুবক ধারণাটি জাভাস্ক্রিপ্টে পরিণত হয়েছে! ধ্রুবক হল মান যা শুধুমাত্র একবার সংজ্ঞায়িত করা যেতে পারে (প্রতি সুযোগ, সুযোগ নিচে ব্যাখ্যা করা হয়েছে)। একই সুযোগের মধ্যে একটি পুনরায় সংজ্ঞা একটি ত্রুটি ট্রিগার করে।

const JOE = 4.0
JOE= 3.5
// results in: Uncaught TypeError: Assignment to constant variable.


আপনি ধ্রুবকটি ব্যবহার করতে পারেন যেখানেই আপনি একটি পরিবর্তনশীল ব্যবহার করতে পারেন ( কোথায় )।

console.log('Value is: ' + joe * 2)
// prints: 8


2. ব্লক-স্কোপড ভেরিয়েবল এবং ফাংশন

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

এই আপডেটের আগে, জাভাস্ক্রিপ্টের ভেরিয়েবলগুলি ফাংশন স্কোপ করা হয়েছিল। যে, যখন আপনি একটি পরিবর্তনশীল জন্য একটি নতুন সুযোগ প্রয়োজন, আপনি একটি ফাংশন মধ্যে এটি ঘোষণা করতে হয়েছিল।

---

---

ভেরিয়েবলগুলি ব্লকের শেষ পর্যন্ত মান ধরে রাখে। ব্লকের পরে, বাইরের ব্লকের মান (যদি থাকে) পুনরুদ্ধার করা হয়।

বিভিন্ন অ্যাকাউন্ট দিয়ে ফেসবুক সাইন ইন করুন

{
let x = 'hello';
{
let x = 'world';
console.log('inner block, x = ' + x);
}
console.log('outer block, x = ' + x);
}
// prints
inner block, x = world
outer block, x = hello


আপনি এই ধরনের ব্লকের মধ্যে ধ্রুবকগুলিকেও পুনরায় সংজ্ঞায়িত করতে পারেন।

---

---

{
let x = 'hello';
{
const x = 4.0;
console.log('inner block, x = ' + x);
try {
x = 3.5
} catch(err) {
console.error('inner block: ' + err);
}
}
x = 'world';
console.log('outer block, x = ' + x);
}
// prints
inner block, x = 4
inner block: TypeError: Assignment to constant variable.
outer block, x = world


3. তীর ফাংশন

ES6 প্রবর্তন করে তীর ফাংশন জাভাস্ক্রিপ্টে। (এগুলি traditionalতিহ্যগত ফাংশনের অনুরূপ, কিন্তু একটি সহজ বাক্য গঠন আছে।) নিম্নলিখিত উদাহরণে, এক্স একটি ফাংশন যা বলা একটি প্যারামিটার গ্রহণ করে প্রতি , এবং তার বৃদ্ধি ফেরত:

var x = a => a + 1;
x(4) // returns 5


এই সিনট্যাক্স ব্যবহার করে, আপনি সহজেই ফাংশনে আর্গুমেন্ট সংজ্ঞায়িত এবং পাস করতে পারেন।

A দিয়ে ব্যবহার করা প্রতিটির জন্য, প্রত্যেকটির জন্য() :

[1, 2, 3, 4].forEach(a => console.log(a + ' => ' + a*a))
// prints
1 => 1
2 => 4
3 => 9
4 => 16


ফাংশনগুলিকে বন্ধনীতে আবদ্ধ করে একাধিক আর্গুমেন্ট গ্রহণের সংজ্ঞা দিন:

[22, 98, 3, 44, 67].sort((a, b) => a - b)
// returns
[3, 22, 44, 67, 98]


4. ডিফল্ট ফাংশন পরামিতি

ফাংশন পরামিতিগুলি এখন ডিফল্ট মান দিয়ে ঘোষণা করা যেতে পারে। নিম্নলিখিতগুলিতে, এক্স দুটি প্যারামিটার সহ একটি ফাংশন প্রতি এবং খ । দ্বিতীয় প্যারামিটার খ এর একটি ডিফল্ট মান দেওয়া হয় ঘ ।

var x = (a, b = 1) => a * b
x(2)
// returns 2
x(2, 2)
// returns 4


C ++ বা পাইথনের মতো অন্যান্য ভাষার মতো, ডিফল্ট মান সহ প্যারামিটারগুলি ডিফল্ট ছাড়াই উপস্থিত হতে পারে। মনে রাখবেন যে এই ফাংশনটি একটি ব্লক হিসাবে সংজ্ঞায়িত করা হয়েছে প্রত্যাবর্তন চিত্রের মাধ্যমে মান।

var x = (a = 2, b) => { return a * b }


তবে যুক্তিগুলি বাম থেকে ডানে মিলেছে। নীচের প্রথম আহ্বানে, খ একটি আছে অনির্ধারিত মান যদিও প্রতি একটি ডিফল্ট মান দিয়ে ঘোষণা করা হয়েছে। পাস করা যুক্তির সাথে মিল আছে প্রতি বরং খ । ফাংশন ফিরে আসে NaN ।

x(2)
// returns NaN
x(1, 3)
// returns 3


যখন আপনি স্পষ্টভাবে প্রবেশ করেন অনির্ধারিত একটি যুক্তি হিসাবে, ডিফল্ট মান ব্যবহার করা হয় যদি একটি থাকে।

x(undefined, 3)
// returns 6


5. বিশ্রাম ফাংশন পরামিতি

একটি ফাংশন আহ্বান করার সময়, কখনও কখনও একটি প্রয়োজন নির্ধারিত যুক্তিগুলির একটি অবাধ সংখ্যায় পাস করতে সক্ষম হয়, এবং ফাংশনের মধ্যে এই যুক্তিগুলি প্রক্রিয়া করার জন্য। এই প্রয়োজন দ্বারা পরিচালিত হয় বিশ্রাম ফাংশন পরামিতি বাক্য গঠন. এটি নীচে দেখানো সিনট্যাক্স ব্যবহার করে সংজ্ঞায়িত আর্গুমেন্টের পরে বাকি আর্গুমেন্টগুলি ক্যাপচার করার একটি উপায় প্রদান করে। এই অতিরিক্ত আর্গুমেন্টগুলি একটি অ্যারেতে ধরা হয়।

var x = function(a, b, ...args) { console.log('a = ' + a + ', b = ' + b + ', ' + args.length + ' args left'); }
x(2, 3)
// prints
a = 2, b = 3, 0 args left
x(2, 3, 4, 5)
// prints
a = 2, b = 3, 2 args left


6. স্ট্রিং টেমপ্লেটিং

স্ট্রিং টেমপ্লেটিং বলতে পার্ল বা শেলের মত সিনট্যাক্স ব্যবহার করে স্ট্রিংয়ে ভেরিয়েবল এবং এক্সপ্রেশনকে ইন্টারপোলেট করা বোঝায়। একটি স্ট্রিং টেমপ্লেট ব্যাক-টিক অক্ষরে আবদ্ধ ( ' )। বিপরীতে একক উদ্ধৃতি ( ' ) অথবা ডবল কোট ( ' ) স্বাভাবিক স্ট্রিং নির্দেশ করে। টেমপ্লেটের ভিতরে এক্সপ্রেশনগুলি চিহ্নিত করা হয়েছে $ { এবং } । এখানে একটি উদাহরণ:

var name = 'joe';
var x = `hello ${name}`
// returns 'hello joe'


অবশ্যই, আপনি মূল্যায়নের জন্য একটি নির্বিচারে অভিব্যক্তি ব্যবহার করতে পারেন।

// define an arrow function
var f = a => a * 4
// set a parameter value
var v = 5
// and evaluate the function within the string template
var x = `hello ${f(v)}`
// returns 'hello 20'


স্ট্রিং সংজ্ঞায়িত করার জন্য এই সিনট্যাক্স মাল্টি-লাইন স্ট্রিং সংজ্ঞায়িত করতেও ব্যবহার করা যেতে পারে।

var x = `hello world
next line`
// returns
hello world
next line


7. বস্তুর বৈশিষ্ট্য

ES6 একটি সরলীকৃত বস্তু তৈরির সিনট্যাক্স নিয়ে আসে। নীচের উদাহরণটি দেখুন:

var x = 'hello world', y = 25
var a = { x, y }
// is equivalent to the ES5:
{x: x, y: y}


গণিত সম্পত্তির নামগুলিও বেশ নিফটি। ES5 এবং এর আগে, একটি গণিত নামের একটি বস্তুর সম্পত্তি সেট করতে, আপনাকে এটি করতে হবে:

var x = 'hello world', y = 25
var a = {x: x, y: y}
a['joe' + y] = 4
// a is now:
{x: 'hello world', y: 25, joe25: 4}


এখন আপনি এটি একটি একক সংজ্ঞায় করতে পারেন:

var a = {x, y, ['joe' + y]: 4}
// returns
{x: 'hello world', y: 25, joe25: 4}


এবং অবশ্যই, পদ্ধতিগুলি সংজ্ঞায়িত করতে, আপনি কেবল নাম দিয়ে এটি সংজ্ঞায়িত করতে পারেন:

var a = {x, y, ['joe' + y]: 4, foo(v) { return v + 4 }}
a.foo(2)
// returns
6


8. আনুষ্ঠানিক শ্রেণী সংজ্ঞা সিনট্যাক্স

শ্রেণী সংজ্ঞা

এবং পরিশেষে, জাভাস্ক্রিপ্ট একটি আনুষ্ঠানিক শ্রেণী সংজ্ঞা সিনট্যাক্স পায়। যদিও এটি ইতিমধ্যেই উপলব্ধ প্রোটাইপ-ভিত্তিক শ্রেণীর উপর নিছক সিনট্যাক্টিক চিনি, এটি কোডের স্বচ্ছতা বাড়ানোর কাজ করে। তার মানে এইটা করে না একটি নতুন অবজেক্ট মডেল বা এর মত অভিনব কিছু যোগ করুন।

class Circle {
constructor(radius) {
this.radius = radius
}
}
// use it
var c = new Circle(4)
// returns: Circle {radius: 4}


পদ্ধতি ঘোষণা

একটি পদ্ধতি সংজ্ঞায়িত করাও বেশ সহজ। সেখানে কোন চমক নেই।

class Circle {
constructor(radius) {
this.radius = radius
}
computeArea() { return Math.PI * this.radius * this.radius }
}
var c = new Circle(4)
c.computeArea()
// returns: 50.26548245743669


Getters এবং Setters

সিনট্যাক্সের সহজ আপডেটের সাথে আমাদের এখন গেটার এবং সেটারও রয়েছে। আসুন আমরা নতুন করে সংজ্ঞায়িত করি বৃত্ত একটি সঙ্গে ক্লাস এলাকা সম্পত্তি

class Circle {
constructor(radius) {
this.radius = radius
}
get area() { return Math.PI * this.radius * this.radius }
}
var c = new Circle(4)
// returns: Circle {radius: 4}
c.area
// returns: 50.26548245743669


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

এখানে পুনরায় সংজ্ঞায়িত শ্রেণী:

class Circle {
constructor(radius) {
this._radius = radius
}
get area() { return Math.PI * this._radius * this._radius }
set radius(r) { this._radius = r }
}
var c = new Circle(4)
// returns: Circle {_radius: 4}
c.area
// returns: 50.26548245743669
c.radius = 6
c.area
// returns: 113.09733552923255


সর্বোপরি, এটি বস্তু ভিত্তিক জাভাস্ক্রিপ্টের একটি চমৎকার সংযোজন।

উত্তরাধিকার

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

class Ellipse {
constructor(width, height) {
this._width = width;
this._height = height;
}
get area() { return Math.PI * this._width * this._height; }
set width(w) { this._width = w; }
set height(h) { this._height = h; }
}
class Circle extends Ellipse {
constructor(radius) {
super(radius, radius);
}
set radius(r) { super.width = r; super.height = r; }
}
// create a circle
var c = new Circle(4)
// returns: Circle {_width: 4, _height: 4}
c.radius = 2
// c is now: Circle {_width: 2, _height: 2}
c.area
// returns: 12.566370614359172
c.radius = 5
c.area
// returns: 78.53981633974483


এবং এটি ছিল জাভাস্ক্রিপ্ট ES6 এর কিছু বৈশিষ্ট্যের সংক্ষিপ্ত পরিচিতি।

পরবর্তী: পরিচিত হওয়া কয়েকটি গুরুত্বপূর্ণ জাভাস্ক্রিপ্ট অ্যারে পদ্ধতি এবং একটি ভয়েস সংবেদনশীল রোবট অ্যানিমেশন স্ক্রিপ্টিং! এছাড়াও, ভিউ নামে একটি দুর্দান্ত ফ্রন্ট-এন্ড ফ্রেমওয়ার্ক সম্পর্কে সন্ধান করুন।

ইমেজ ক্রেডিট: মাইক্রোলজিয়া/ আমানত ছবি

শেয়ার করুন শেয়ার করুন টুইট ইমেইল ক্যানন বনাম নিকন: কোন ক্যামেরা ব্র্যান্ড ভাল?

ক্যানন এবং নিকন ক্যামেরা শিল্পের দুটি বড় নাম। কিন্তু কোন ব্র্যান্ড ক্যামেরা এবং লেন্সের উন্নত লাইনআপ অফার করে?

গুগলে কে আপনাকে সার্চ করে দেখতে পারেন

পরবর্তী পড়ুন সম্পর্কিত বিষয়

• প্রোগ্রামিং
• জাভাস্ক্রিপ্ট

লেখক সম্পর্কে জয় শ্রীধর(17 নিবন্ধ প্রকাশিত) জয় শ্রীধর থেকে আরো

আমাদের নিউজলেটার সদস্যতা

প্রযুক্তি টিপস, রিভিউ, ফ্রি ইবুক এবং এক্সক্লুসিভ ডিলের জন্য আমাদের নিউজলেটারে যোগ দিন!

সাবস্ক্রাইব করতে এখানে ক্লিক করুন