Photo by Philip Swinburn on Unsplash

JAVASCRIPT’IN TARIHÇESI

JS’de ES6 ve Sonrasında Gelen Yardımcı Fonksiyonlar

Includes, Exponentiation operator

Bu yazıyı daha önceden yazmış olduğum Javascript’in Tarihçesi yazısının bir devamı olarak yazıyorum. Bir çok kavramı tek bir yazıda ele almanın yaratacağı karmaşıklıktan kaçmak için bu yönteme başvurdum. Bu yazılardaki amacım önceden Javascript’in varolan hangi özelliklerinin yetmediğini ve bu geliştirmeyle neyi hedeflediklerini anlatacağım

Bu bölümde anlatması çok karmaşık olmayan yeniliklerden bahsetmek istiyorum. Özetle;

• Array.prototype.includes()
• Array.prototype.(flat, flatMap)
• Exponentiation operator
• String.prototype.(padStart/padEnd)
• String.prototype.(trimStart/trimEnd)
• String.prototype.repeat()
• String.codePointAt()
• Object.values()
• Object.entries()
• Object.fromEntries()
• Object.getOwnPropertyDescriptor()
• Object.is()
• Object.assign()
• Object.setPrototypeOf()
• Trailing commas
• Symbol.prototype.description

1. Array.prototype.includes()

Array includes metodu olmadan önce biz çoğu yerde Array indexOf metodunu kullanıp değeri -1 den fazla ise bu değeri içeriyordur diyorduk. Ama baktığımızda indexOf metodunun amacı farklı. Kaçıncı eleman olduğunu istemiyoruz istediğimiz array bu elemanı içerip içermediği

const arr=['red','green','blue'];
console.log(arr.includes('green'));

Aynı durumu String türünde de görebiliriz

str.includes('substring')  gives true/false
str.indexOf('substring') !== -1  gives position check -1 
str.match(/substring/g)> 0 gives count or repeat
(new RegExp('substring')).test(str)

2 Array.prototype.(flat, flatMap)

flat() çok boyutlu array yapılarını tek boyutlu hale dönüştürür.

const a0=['AA', ['BB', 'CC']].flat(); console.log(a0); 
//['AA', 'BB','CC']
const a1=['AA', ['BB', ['CC']]].flat(2); console.log(a1);
//['AA', 'BB','CC']
const a2=['AA', ['BB', ['CC', ['DD']]]].flat(Infinity); console.log(a2); //['AA', 'BB','CC']

flatMap() ise map donen array değerini tek boyutlu bir hale getirir.

const b0=['Aa bb', 'cc dd'].map(words => words.split(' ')); console.log(b0); [[AA bb],[cc dd]]
const b1=['Aa bb', 'cc dd'].flatMap(words => words.split(' ')); console.log(b1); [AA, bb, cc, dd]

3. Exponentiation operator

2 üzeri 4 demek için Math.pow yerine ** komutlarını kullanabilirsiniz.

console.log(Math.pow(2,4)); //16
console.log(2**4); //16

4. String.prototype.(padStart/padEnd)

String belli bir karaktere kadar tamamlamanızı sağlar.

• boş karakterle mi / belli bir örüntü ile mi tamamlanacak.
• padStart/padEnd: doldurma işleminin başa mı/ sona mı ekleneceğini

console.log('abcd'.padStart(4));  //'abcd'
console.log('abcd'.padStart(8));  //'    abcd'
console.log('abcd'.padStart(12)); //'        abcd'
console.log('abcd'.padStart(12,'xyz')); //'xyzxyzxyabcd'
console.log('abcd'.padEnd(12)); //'abcd        '
console.log('abcd'.padEnd(8));  //'abcd    '
console.log('abcd'.padEnd(4));  //'abcd'
console.log('abcd'.padStart(12,'xy')); 'xyxyxyxyabcd'

5. String.prototype.(trimStart/trimEnd)

String başında veya sonunda boşluklar varsa onları siler.

' AAAA'.trimStart() //'AAAA'
' AAAA '.trimStart() //'AAAA '
' AAAA '.trimEnd() //' AAAA'
'AAAA '.trimEnd() //'AAAA'

6. String.prototype.repeat()

String tekrarları oluşturabilmek için bir fonksiyon.

‘Müdür ’.repeat(3) //’Müdür Müdür Müdür’
‘Yemiş ’.repeat(2) //’Yemiş Yemiş’
‘Dolmuş ’.repeat(2) //’Dolmuş Dolmuş’

7. String.codePointAt()

16-bit Unicode ile ile ifade edilmeyen String için

"SpecialChar".charCodeAt(0).toString(16) //d842
"SpecialChar".charCodeAt(1).toString(16) //dfb7

8. Object.values()

Objenin içerisindeki nesnenin kendi değerleri array olarak döndürür.

const me={ name:"Onur", age:39, height:180}
console.log(Object.values(me)); //["Onur",39,180]
const names=['Onur','Ali','Veli'];
console.log(Object.values(names)); //['Onur','Ali','Veli']

9. Object.entries()

Objenin içerisindeki nesnenin kendi değerleri [key,value] array olarak döndürür.

const me={ name:"Onur", age:39, height:180}
console.log(Object.entries(me)); //[{"name":"Onur"},...]
const names=['Onur','Ali','Veli'];
console.log(Object.entries(names)); //[{0:'Onur'},...]

10. Object.fromEntries()

Entries üzerinden nesne klonu oluşturmak için kullanılır.

const me={ name:"Onur", age:39, height:180}
const entries=Object.entries(me);
console.log(entries); //[{"name":"Onur"},...]
const meClone=Object.fromEntries(entries)
console.log(meClone)

11. Object.getOwnPropertyDescriptor()

Objenin property değerinin özellikleri value, writable, configurable, enumerable, get, set hakkında bilgi verir.

const me={ name:"Onur", age:39, height:180}
console.log(Object.getOwnPropertyDescriptor(me,'age'));
//{value:39,writable:true,enumerable:true,configurable:true}

12. Object.is()

Değerleri karşılaştırmak için geliştirilmiş bir fonksiyondur ve aşağıdaki durumlar haricinde değeri hep false döner Örneğin 0 ve -0 için false döner.

aynı nesne olmalı.
String veya Number değerleri aynı olmalı
true, false, undefined, null, NaN değerleri aynı olmalı

13. Object.assign()

Objenin shallow copy oluşturmanızı sağlar. Bu konuyu şu yazımda detaylıca anlatmıştım

const copied = Object.assign({}, original)

14. Object.setPrototypeOf()

Objeye prototype atamasını gerçekleştirir. Bu sayede parent nesnesine assign ettikten sonra ondan türeyen daha detay bir objeyide setPrototype ile assign edebiliriz.

//Object.setPrototypeOf(object, prototype)
const dog = Object.create(animal)
Object.setPrototypeOf(dog, mammal)

15. Trailing commas

Array ve Objelerin sonuna, koyma imkanıdır.

const arr = [ 1, 2 , ]; 
const me={ name:"Onur", age:39, height:180,}

16. Function.prototype.toString()

Fonksiyon kaynak kodunu String olarak döner.

function sum(a,b){return a+b;} console.log(sum.toString())
// function sum(a,b){return a+b;}

Okumaya Devam Et 😃

Bu yazının devamı veya yazı grubundaki diğer yazılara erişmek için bu linke tıklayabilirsiniz.