Her Web Geliştiricisinin Bilmesi Gereken 12 Önemli JavaScript İşlevi

Bu yazıda her web geliştiricisi için 12 önemli JavaScript işlevi göstereceğim. Burada öğreneceğiniz her şey gelişiminizi hızlandıracak ve değerli zamanınızdan tasarruf sağlayacaktır!

Bir web geliştiricisi olarak zamandan tasarruf etmek ve kodu optimize etmek için 12 önemli JavaScript işlevi.

1. Konsol günlüğünü kısaltın

Kodunuza tekrar tekrar console.log() yazmaktan sıkıldınız mı? Bu kolay komut dosyası bind, geliştirme sürecini hızlandırmak için konsol günlüğünü kısaltmak için kullanılır (Bu, her işlevle yapılabilir).

const log = console.log.bind(document)
log("does it work?")
log(yes)
log(5)

2. İki diziyi tek bir dizide birleştirin

Herhangi bir boyuttaki iki diziyi tek bir dizide birleştirmek istiyorsanız concate JavaScript işlevini kullanabilirsiniz.

const array1 =  ["One" ,"Two", "Three"]
const array2 =  ["Four" ,"Five", "Six"]
const merged = array1.concat(array2)
console.log(merged) // "One" ,"Two", "Three", "Four" ,"Five", "Six"

3. İki nesneyi tek bir nesnede birleştirin

Nesnelerle çalışıyorsanız, bu basit numara ile onları birleştirebilirsiniz.

const user = {
    name: 'Paul Walker',
    gender 'Male'
};
const article = {
    title: 'JavaScript tips',
    date: '2021-11-19'
};
const summary = {...user, ...article}
console.log(summary)
// Output:
// date: '2021-11-19'
// gender 'Male',
// name: 'Paul Walker',
// title: 'JavaScript tips'

4. Bir diziyi kısaltın

Web geliştiricileri için bir diziyi kısaltmanın kolay bir yolu vardır. uzunluk yöntemini kullanmanız ve gerçek dizi boyutundan daha küçük bir sayı iletmeniz gerekir.

const big_array = ["One" ,"Two", "Three", "Four" ,"Five", "Six"]
big_array.length = 3
console.log(big_array) // ["One" ,"Two", "Three"]

5. Bir diziyi karıştır

Bazen bir dizi içindeki değerleri rastgele seçmek istersiniz. Bunu başarmak için Array.sort işlevi rastgele bir compareFunction.

const array = ["One" ,"Two", "Three", "Four" ,"Five", "Six"]
array.sort(function (){ return Math.random() - 0.5})
console.log(array)

6. Bir numarayı doğrulamak için isNum'u kullanın

Bu fonksiyon ile bir değer veya değişkenin sayı olup olmadığını (int, float vb.) kontrol edebilirsiniz.

function isNum(n) { return !isNum(parseFloat(n)) && isFinite(n); }

console.log(isNum(1337)) //true
console.log(isNum(13.37)) //true
console.log(isNum("JavaScript")) //true

7. Bir dizeyi doğrulamak için isStr kullanın

Bu fonksiyon ile bir değerin veya değişkenin string formatında olup olmadığını kontrol edebilirsiniz.

const isStr = value => typeof value === 'string';

console.log(isStr('JavaScript')) //true
console.log(isStr(345)) //false
console.log(isStr(true)) //false

8. isNull kullanın

Genellikle bir sonucun veya verinin boş olup olmadığını kontrol etmek yararlıdır.

const isNull = value => value === null || value === undefined;

console.log(isNull(null)) //true
console.log(isNull()) //true
console.log(isNull(123)) //false
console.log(isNull("J")) //false

9. Bir işlevin performansını hesaplayın

Bir fonksiyonun ne kadar süre çalıştığını kontrol etmek istiyorsanız, programınızda bu yaklaşımı kullanabilirsiniz.

const start = performance.now();
// some program
const end = performance.now();
const total = start - end
console.log("function takes " + total + " milisecond")

10. Bir diziden kopyaları kaldırın

Genellikle içinde yinelenen veriler bulunan bir diziyle karşılaşırız ve bu yinelenenleri kaldırmak için bir döngü kullanırız. Bu işlev, bir döngü kullanmadan kopyaları kolay bir şekilde kaldırabilir.

const delDuplicates = array => [...new Set(array)]
console.log(delDuplicates([
    "One" ,"Two", "Three", "Two" ,"Four",
    "Five" ,"Four", "Three", "One" ,"Five",
    "Five" ,"Three", "Four", "One" ,"Two",
]))

// Output:
// "One" ,"Two", "Three", "Four" ,"Five",

11. Koşullar için mantıksal VE/VEYA kullanın

Bir if koşulu kullanmak yerine mantıksal bir VE/VEYA kullanabilirsiniz. Bu, komutları yürütmek için bir işlev içinde kullanılabilir.

const input = 2
input === 5 && console.log("it is 5")
input === 5 || console.log("it is not 5")

veya değer atamak için

function defaultsTo5(arg) {
    arg = arg || 5; // arg will have 5 as a default value if not set
    console.log(arg)
}

let arg1 = 2
let arg2 = null
defaultsTo5(arg1) // 2
defaultsTo5(arg2) // 5

12. Üçlü operatör

Üçlü operatör sadece harika. Üçlü işleçlerle kötü görünümlü iç içe koşullu if..else..elseif'i önleyebilirsiniz .

function temperature(temp) {
    return (temp > 39 || temp < 35.5) ? 'Visit Doctor!'
        : (temp < 37.5 && temp > 36.5) ? 'Go Out and Play!!'
            : (temp <= 39 && temp >= 35.5) ? 'Take Some Rest!' : ''
}

console.log(temperature(38))    // Take Some Rest!
console.log(temperature(36))    // Take Some Rest!
console.log(temperature(39.1))  // Visit Doctor!
console.log(temperature(35.))   // Visit Doctor!
console.log(temperature(37))    // Go Out and Play

Kapanış

Umarım bu gönderiyi faydalı bulursunuz! Ayrıca paylaşacak iyi JavaScript işlevlerine sahipseniz, burada bizimle ve diğer geliştiriciler için paylaşmaktan çekinmeyin. Keyifli kodlamalar...

Ek olarak, herhangi bir sorununuz varsa, yardım sayfamızdan bir bilet eklemekten çekinmeyin.