자바스크립트 용어 정리 하기

The World of Loops

nested for loops

• 2 for loops

for (let i =0;i<=10; i++) {
  console.log('OUTER LOOP:',i);
  for (let j =5;j>=o;j-=2) {
    console.log(' INNER LOOP:',J);
  }
}

그러면 어떨때 써야 하는가?

const gameBoard = [
  [4,32,8,4],
  [64,8,32,2],
  [21,3,53,2],
  [3,4,2,3]
  ];

let totalScore=0;//이렇게 array 안에 array를 하기 위해 사용
for(let i=0; i<gameBoard.length; i++) {
  let row = gameBoard[i];
  for(let j=0; j<row.length;, j++) {
    totalScore+=row[j];
  }
}

for ...Of (x supported in IE)

for (variable of iterable) {
statement }

let coffee = ['cold brew', 'latte', 'americano'];
for (let i =0;i <coffee.length;i++) {
  console.log(coffee[i]);
}

for (let drinks of coffee) {//위와 같이 적용 됨 
  console.log(drinks);
}

for(let char of 'coffee') {
  console.log(char.toUpperCase());
  

for in

for (variable in object) {
statement }

const joanne = {
  regularPlay: 20000,
  sometimesPlay: 10000,
};

for (let prop in joanne) {
  console.log(prop);//이렇게 하면 regularPlay, sometimesPlay가 출력 됨 
  console.log(joanne[prop]);//이렇게 하면 숫자까지 다 출력 됨 
}

advanced function

-이제 var 쓰면 안되는 이유?
: scoping rule을 어김, var는 함수 호출하기 전에 정의해도 괜찮음 그래서 혼선 있을수 있음! (var는 hoisting 됨)

lexical function

nested function

function outer() {
  let movie = "Amadeus";
  
  function inner() {
    let movie = "hi"
    console.log(movie.toUpperCase())}
  }
inner(); //이렇게 하면 먼저 inner안에서 movie variable을 찾는데 만약에 없으면 더나아가 outer에서 movie variable을 찾아서 출력하게 된다

}

function expression

-possible because functions are objects 

function add(x,y) {
  return x+y;
  
const sum = function (x,y) {
return x+y;
} 

Higher Order Function

Returning Function

• function factories

function multiplyBy(num) {
  return function (x) {
    return x*num;
  }
}

function makeBetweenFunc(x,y) {
  return fuction (num) {
    return num >=x && num<=y;
  }
}

const isChild = makeBetweenFunc(0,8);
isChild(9)//하면 ㄹfalse 출력 됨 

Built-in functions

function grumpus() {
  alert("go away");
}

setTimeout(grumpus,5000);

//inline으로 만들면
setTimeout(function () {alert("go away")},5000);

Apply Functions to Collection of Data(array)

.forEach

• ForEach랑 for of 쓸수있음 같은 의미로

const numbers =[20,21,22,23,24];

numbers.forEach(function (num) {
  console.log(num*2);
}) 

function printTriple(n) {
  console.log(n*3);
}

numbers.forEach(printTriple);

//이렇게 하면 numbers에 *3 되서 60.63,66,69 이렇게 출력됨 

.map

• building new arrays from existing arrays

const texts = ['rofl','lol','omg','ttyl'];
const caps = texts.map(function (t) {
  return t.toUppercase();
})
text;// ['rofl','lol','omg','ttyl']
caps; //['ROFL','LOL','OMG','TTYL']

arrow functions!!

const square= function (x) {
  return x*x;
}

const square = x => {
  return x*x; 
}

const square = x => (x*x);

.every (boolean method)

const words = ["dog", "dig", "bag", "wag"];

words.every(word => {
  return word.length === 3; }) //이렇게 하면 true가 출력 됨 b/c 다 세글자라서 

words.every(word[0] ==='d');//false 

words.every(w => {
  let last_letter = w[w.length-1];
  return last_letter ==='g'
}) //true 출력됨 

.some (boolean method)

• similar to every, but returns true if any of the array elements pass the test function

const words = ['dog','cupcake','bag','wag'];

//Are there any words longer than 4 characters? 
words.some(word => {
  return word.length>4;
}) //true

//Do any words start with 'z'?
words.some(word =>word[0] ==='z');//false

//Do any words contain 'cake'?
words.some(word => word.includes('cake'))//true 

.sort

const prices = [400,500,30,12,1300];

prices.sort();
//[12,1300,30,400,500]

prices.sort((a,b) => a-b)
//작은 순서대로 출력 (작은숫자에서 큰숫자)
prices.sort((a,b) => b-a)
//큰 순서대로 출력(큰숫자 에서 작은숫자)

.reduce

• reducing array into certain format