•
X (Twitter)' da paylaş
Alt başlıkları yazarken genel adı olanları ingilizce olarak yazacağım. Bu şekilde araştırmak isteyenler için anahtar kelimeyi vermiş olurum.
const name = "Berat";
const surname = "Bozkurt";
const age = 23;
const photo = null;
const title = "frontend developer"
const user = {
name,
surname,
age,
...photo && {photo},
...title && {title}
}
console.log(user); {name: "Berat", surname: "Bozkurt", age: 23, title: "frontend developer"}photos değişkeni herhangi bir değer dönmediği için user nesnesine eklemedik ve daha sade bir yapı oluşturmuş olduk.Bu yapıyı daha çok API'ye gönderirken boş değerli key'leri göndermek istemediğim zaman kullanıyorum. Bu şekilde daha temiz bir yapı oluşturmuş oluyor. Ayrıca nesnemizdeki özellikler fazla olduğu zaman da kontrol etmek ayrıca kolay olmaktadır.
null veya undefined ise istediğimiz değeri atayabiliriz. Şöyle bir örnekle bunu somutlayabiliriz. PostCard diye bir bileşinimiz olsun. Bu bileşenin içinde de bir öne çıkarılan görseli olsun. Eğer bu öne çıkarılan görsel eklenmediyse buraya arkaplanı gri olan bir görsel yükleyeceğimizi düşünelim. Hadi bunu koda dökelim.,var firstImage =
"https://tr.m.wikipedia.org/wiki/Dosya:Image_created_with_a_mobile_phone.png";
var secondImage = null;
var firstPostImage = firstPostImage ?? "https://via.placeholder.com/150";
var secondPostImage = secondImage ?? "https://via.placeholder.com/150";
console.log(firstPostImage); // https://tr.m.wikipedia.org/wiki/Dosya:Image_created_with_a_mobile_phone.png
console.log(secondPostImage); // https://via.placeholder.com/150null veya undefined değilse istediğimiz değeri atayabiliyoruz. Somut bir örnek olması için şu örneği verebilirim. Kullanıcı başarılı bir şekilde sisteme giriş yaptıysa 'Hoşgeldiniz Berat Bozkurt' yazsın.var user = {
name: "Berat",
surname: "Bozkurt",
isLogin: true,
};
var welcomeMessage =
user.isLogin && "Hoşgeldiniz " + user.name + " " + user.surname;
console.log(welcomeMessage); // Hoşgeldiniz Berat Bozkurt