JavaScript Temel Örnekleri v.1

Core Syntax;

var name = 'oguz';
var age = 28;
var hasHobies = true;
function summarizeUser(userName, userAge, userHasHobby) {
return ('Name is ' + userName + ', age is ' + userAge + ' and the user has hobbies: ' + userHasHobby);
}
console.log(summarizeUser(name,age,hasHobies));

node play.js

let & const

const name = 'oguz'; // kodda sabit planlanan
let age = 28; // değişiklik planlanan
const hasHobies = true; // Sabit planlanan
age = 30; // değişiklik, const üzerinde yapılırsa node play.js de hata alır
function summarizeUser(userName, userAge, userHasHobby) {
return ('Name is ' + userName + ', age is ' + userAge + ' and the user has hobbies: ' + userHasHobby);
}
console.log(summarizeUser(name,age,hasHobies));

Arrow Fonksiyonu anlamak;

const name = 'oguz'; // kodda sabit planlanan
let age = 28; // değişiklik planlanan
const hasHobies = true; // Sabit planlanan
age = 30; // değişiklik, const üzerinde yapılırsa node play.js de hata alır
const summarizeUser = (userName, userAge, userHasHobby) => {
return ('Name is ' + userName + ', age is ' + userAge + ' and the user has hobbies: ' + userHasHobby);
}
const add = (a,b) => {
return a + b ;
}
// yada
const add1 = (a,b) => a+b;
// yada
const add2 = a => a+1;
// yada
const addR = () => 1+2;
console.log(addR()); // -> 3
console.log(add(1,2)); // -> 3
console.log(add1(1,2)); // -> 3
console.log(add2(1)); // -> 2
console.log(summarizeUser(name,age,hasHobies));

Objects , Properties & Method

const person = {
name : 'oguz',
age: 29,
greet() {
console.log('hi, I am ' + this.name);
}
};
person.greet();

Arrays & Arrays

const person = {
name : 'oguz',
age: 29,
greet() {
console.log('hi, I am ' + this.name);
}
};
const hobbies = ['Sports','Eating', 1, true, {}];
for(let hobby of hobbies ) {
console.log(hobby);
}
console.log(hobbies.map( hobby => 'Hobby: ' + hobby ));

Object And Reference Type

const person = {
name: 'oguz',
age: 29,
greet(){
console.log('Hi, I am' + this.name );
}
};
const hobbies = ['Sports','Eating', 1, true, {}];
hobbies.push('Programing');
console.log(hobbies);

Spread And Rest Operators

const person = {
name: 'oguz',
age: 29,
greet(){
console.log('Hi, I am' + this.name );
}
const copiedPerson = {…person}; // …Spread syntax
console.log(copiedPerson);
const hobbies = ['Sports','Eating', 1, true, {}];
};
const copiedArray = […hobbies]; // …Spread syntax
console.log(copiedArray);
const toArray (…args) => { // …Rest
return args;
};
console.log(toArray(1,2,3,4)); // …Rest

Fark;

Öğeleri veya özellikleri dizilerden veya nesnelerden pull etmek için mi kullanıyorsunuz?

O zaman Spread operatörü olacaktır.

birden çok bileşeni merge etmek amacınız ise

O zaman Rest operatörü olacaktır.

aslında birbirinin çok benzeri olan fakat farklı şekillerde olan bir uygulama biçimi olduğunda değişik adlandırılan bir yapıdır.

Destructuring

const person = {
name: 'oguz',
age: 29,
greet(){
console.log('Hi, I am' + this.name );
}
const printName = ({name}) => {
console.log(name);
}
printName(person);
cons {name, age}= person;
console.log(name,age);
const hobbies = ['Sports', 'cooking'];
const [hobby1, hobby2] = hobbies;
console.log(hobby1,hobby2);

Async Code And Promises

const fetchData = () => {
const promise = new Promise((resolve, reject) => {
setTimeout(() => {
resolve('Done!');
}, 1500);
});
return promise;
};
setTimeout(() => {
console.log('Timer is done!');
fetchData()
.then(text => {
console.log(text);
return fetchData()
})
.then(text2 => {
console.log(text2);
});
}, 2000);
console.log('Hello!');
console.log('Hi!');

neyse buda şimdilik böyle bir hatırlatma blogu olsun kendim için.