-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathFunciton.js
More file actions
114 lines (79 loc) · 2.98 KB
/
Copy pathFunciton.js
File metadata and controls
114 lines (79 loc) · 2.98 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
// Function
// Arrow function Start
function hello (firstName) {
console.log(`Merhaba ${firstName}`)
}
hello("JavaScript")
const helloFuncV1 = (firstName) => {console.log(`Merhaba ${firstName}`)}
helloFuncV1("helloFuncV1")
const helloFuncV2 = firstName => console.log(`Merhaba ${firstName}`)
helloFuncV2("helloFuncV2")
const helloFuncV3 = (firstName, lastName) =>
console.log(`Merhaba ${firstName} ${lastName}`)
helloFuncV3("helloFuncV3","Last name info")
const helloFuncV4 = (firstName, lastName) => {
let info = `Merhaba ${firstName} ${lastName}`
console.log(info)
return info
}
helloFuncV4("helloFuncV4","Other info")
// Not
// "this" keyword;
// this'in arrow fonksiyonlardaki davranışı, regular fonksiyonlardaki davranışından farklıdır. Nasıl ve nerede oluşturulursa oluşturulsun this'in arrow fonksiyonu içerisindeki değeri her zaman parent fonksiyonuna eşittir.
// Diğer bir deyişle arrow fonksiyonu kendi execution context'ini oluşturmaz. Yani kendisini referans göstermez, her zaman parent'ına bakar.
let movie = {
name: "La la land",
thisInArrow:() => {
console.log("Movie name is " + this.name); // 'this' window'u referans gösterir. Bu yüzden name'yi bulamaz.
},
thisInRegular(){
console.log("Movie name is " + this.name); // 'this' kendisini referans gösterir ve çalışır.
}
};
movie.thisInArrow(); // output : Movie name is
movie.thisInRegular(); // output : Movie name is La la land
const seriesList = list => {
list.forEach((series, index) => {
console.log(`${index+1}. ${series}`)
});
};
seriesList(["Firefly", "The Mandalorian","Breaking Bad"]);
/* output:
1. Firefly
2. The Mandalorian
3. Breaking Bad
*/
const newArray = (nums) => {
const newNums = nums.map(e=>{
if(e%2==0){
return e*2
}else if(e%2==1){
return e*3
}
});
return newNums
}
console.log(newArray([1,2,3,4,5])); // output: [3,4,9,8,15]
// Arrow function End
// Bölüm sonu egzersizi
let greeting = document.querySelector("#greeting")
greeting.addEventListener("click",domClik)
greeting.addEventListener("mouseover", domClik)
function domClik() {
console.log("tıklandı")
// this.innerHTML = "Tıklandığı için bilgi değişti"
// greeting.className += "text-primary text-center";
this.style.color == "red" ? this.style.color ="blue" : this.style.color = "red"
}
let counter = 0
let counterDOM = document.querySelector('#counter')
let increaseDOM = document.querySelector('#increase')
let decreaseDOM = document.querySelector('#decrease')
counterDOM.innerHTML = counter
increaseDOM.addEventListener("click", clickEvent)
decreaseDOM.addEventListener("click", clickEvent)
function clickEvent() {
console.log(this.id)
this.id == "increase" ? counter += 1 : counter -= 1
counterDOM.innerHTML = counter
}