رسول اسماعیلی
رسول اسماعیلی
خواندن ۴ دقیقه·۴ سال پیش

ES5 vs ES6 - بخش سوم

سلام دوستان خوش اومدین به بخش سوم، تا الان دو بخش از این سری رو پشت سر گذاشتیم که امیدوارم مطالعه کرده باشید. در بخش اول و دوم هشت عنوان اول لیست بررسی شد در این بخش نیز به ادامه عناوین لیست خواهم پرداخت.

لیست تغییرات این نسخه :

  • Block-Scoped Variables and Constants (let, const)
  • Arrow Functions
  • Default Parameter Values
  • Spread Operator
  • String Interpolation
  • Raw String Access
  • Promises
  • Binary & Octal Literal
  • Regular Expression Sticky Matching
  • Manipulating objects
  • Value Export/Import
  • Classes
  • Symbol Type
  • Iterator & For-Of Operator
  • Generators
  • Map/Set & WeakMap/WeakSet
  • New Built-In Methods




Regular Expression Sticky Matching

خب، Regular Expression یا عبارت های منظم مجموعه ای از کاراکتر هاست که ما توسط آن ها یک الگو برای رشته ها تعریف می کنیم. این الگو ها به ما کمک می کنند کارهایی زیادی با رشته ها انجام بدیم مثل اعتبار سنجی رشته های ورودی و غیره .

تعریف یک عبارت منظم:

new RegExp(/ab+c/, 'i') // literal notation new RegExp('ab+c', 'i') // constructor var patt = /ab+c/;

در جاوا اسکریپت از چند راه میشه از عبارت های منظم استفاده کرد:

//Using String search() let res = &quotrasool&quot.search(/ol/); // output: 4 //Use String replace() &quotrasool esmaili!&quot.replace(/rasool/, &quotamin&quot) // output: amin esmaili //Using test() let patt = /^r/ ; // any string start with r patt.test(&quotrasool esmaili&quot); // output: true //Using exec() /go+gle/.exec(&quotwww.google.com&quot) // output: google

چند Flag وجود داره که باعث تغییر رفتار عبارت های منظم میشه. Flag ها دقیقا بعد از عبارت منظم قرار میگیرند مثلا:

/go+gle/i.exec(&quotwww.GooGlE.com&quot) // output: GooGlE

کاراکتر i که دقیقا بعد از تمام شدن عبارت منظم اومده باعث میشه نسبت به بزرگ و کوچک بودن حروف حساس نباشد.

حالا در ES6 چند Flag اضافه شده است :

y Flag (sticky)

با استفاده از این Flag می تونیم جستجو را دقیقا ازیک قسمت خاص از رشته شروع کنیم، به این صورت که از نقطه ای که ما تعیین میکنیم یک به یک کاراکتر ها را با عبارت منظم بررسی می کند و اگر به رشته دلخواه نرسد جستجو را متوقف میکند و مقدار null را بر میگرداند در حالی که ممکن است رشته حاوی مقدار مدنظر عبارت منظم باشه اما در نقطه ای که ما تعیین کردیم پیدا نشده باشه:

let text = &quothello1 hello2 hello3&quot, pattern = /hello\d\s?/, // ----- start from position 0 and looking for hellox so find hello1 pattern.lastIndex = 0; pattern.exec(text); // hello1 // ----- start from position 2 and looking for hellox so find nothing pattern.lastIndex = 2; pattern.exec(text); // null // ----- start from position 7 and looking for hellox so find hello2 pattern.lastIndex = 7; pattern.exec(text); // hello2



Manipulating objects

دستکاری، مقداردهی و کار با Object ها در ES6 خیلی راحت تر شده برای مثال استفاده از اپراتور Spread که در بخش اول بررسی کردم برای ادغام کردن دو Object و غیره، در ادامه نمونه هایی از این تغییرات را اوردم:

ادغام کردن :

ES5:

var obj1 = { a: 1, b: 2 } var obj2 = { a: 2, c: 3, d: 4} var obj3 = Object.assign(obj1, obj2)

ES6:

const obj1 = { a: 1, b: 2 } const obj2 = { a: 2, c: 3, d: 4} const obj3 = {...obj1, ...obj2}

تبدیل یا مقدار گرفتن از Object

ES5:

var obj1 = { a: 1, b: 2, c: 3, d: 4 } var a = obj1.a var b = obj1.b var c = obj1.c var d = obj1.d

ES6:

const obj1 = { a: 1, b: 2, c: 3, d: 4 } const { a, b, c, d } = obj1

ساخت Object

ES5:

var a = 1 , b = 2 , c = 3 , d = 4 var obj1 = { a: a, b: b, c: c, d: d }

ES6:

var a = 1 , b = 2 , c = 3 , d = 4 var obj1 = { a, b, c, d }



Value Export/Import

در این نسخه به طور کلی syntax این کار (Export/Import) عوض شده و همچنین این امکان فراهم شده که چندین مقدار را جداگانه export و import کنیم.

ES5:

var someModule = { code: 200, message: function(){ console.log('This is ES5') }} module.exports = myModule;

ES6:

const someModule = {code: 200, message: () => { console.log('This is ES6') }} export myModule; //multiple value export const x = 1; export const y = 2; export const z = 'String' import {x, y, z} from './someModule ;

می خواستم در مورد Class ها هم در این بخش براتون بنویسم اما فکر می کنم تا اینجا هم خیلی طولانی شده باشه، انشالله اگر عمری باقی باشه در بخش بعدی براتون می نویسم. ممنون ازتوجه تون. شادُ خندونُ سلامت باشید. (:


برنامه نویسیجاوااسکریپتes6regular expressionobject
رسول اسماعیلی - برنامه نویس
شاید از این پست‌ها خوشتان بیاید