화살표 함수 Arrow function

  • 기본형태
let functionName = (argument1, arg2, ...argN) => expression;

let double = (n) => n * 2;

let double = function(n) { 
	return n*2;
 }
  • forEach(), map(), filter() 속에서도 가능
array.forEach(element => {
    //code
});
  • array.filter() 는 주어진 함수의 테스트를 통과하는 모든 요소를 모아 새로운 배열로 반환
const result = studentsInfo.filter(({ score }) => score >= 90);

//https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/filter
const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];
const result = words.filter(word => word.length > 6);
  • array.map()  배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환
names = result.map(({ name }) => name);

//https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/map
const array1 = [1, 4, 9, 16];
const map1 = array1.map(x => x * 2);

'프로그래밍 > JavaScript' 카테고리의 다른 글

array.reduce()  (0) 2023.07.30
Class  (0) 2023.07.13
콜백(callback)함수  (0) 2023.07.12
Function(함수)  (0) 2023.07.11
배열 과 객체 의 for loop  (0) 2023.07.09

<정의>

함수안에 파라미터로 들어가는 함수

<용도>

순차적으로 실행하고 싶을때 씀

 

<사용 예시>

function sortTest(ls,cb){
	ls.sort((previous, current) => previous-current);
	cb("Assending",ls)
    ls.sort((previous, current) => current-previous));
    cb("Dessending", ls)
    
}

function print(message, ls){
	consol.log(`${message}`)
    for(const i of ls){
    	consol.log(`call back test: ${i}`);
        }
}

let tempArr = [1,5,8,3,10]
sortTest(tempArr,print)

// for each

// 기본형태
array.forEach(element => {
   // code 
});


tempArr.forEach((value, index, array) => console.log(tempArr[index]));

//풀어서 쓰면 아래와 같다.
const test = function (value, index, array) {
  console.log(tempArr[index]);
};
tempArr.forEach(test);

'프로그래밍 > JavaScript' 카테고리의 다른 글

Class  (0) 2023.07.13
Functions - arrow, map, filter  (0) 2023.07.12
Function(함수)  (0) 2023.07.11
배열 과 객체 의 for loop  (0) 2023.07.09
var, let, const  (0) 2023.07.09

함수란?  -> 반복되는 작업을 하나로 묶어주는 기능.

함수 구조

function 함수이름 (매개변수){ // 매개변수 = 파라미터 = 인자
	코드
    return 반환값 // 반환값 = 리턴값
 }

반복되는 작업이란?

 

구구단을 예를 들면 1단~9단까지 변하는 것은  곱셈에서 앞의 숫자이고 나머지는 반복되는 구조

아래의 코드처럼 함수를 작성해서 필요할때 마다 호출해서 사용이 가능

// x 단 * i
function multiplicationTable(x) {
  for (let i = 1; i < 10; i++) {
    console.log(`${x} * ${i} = ${x * i}`);
  }
}

multiplicationTable(8) // 8단
multiplicationTable(5) // 5단

 

JS 에서 자주 사용되는 함수는  화살표 함수 라고 한다.

const sum = (a, b) =>{
	retrun a + b;
}

// 더 간단한 방법
const sum = (a, b) => a + b;

 

'프로그래밍 > JavaScript' 카테고리의 다른 글

Functions - arrow, map, filter  (0) 2023.07.12
콜백(callback)함수  (0) 2023.07.12
배열 과 객체 의 for loop  (0) 2023.07.09
var, let, const  (0) 2023.07.09
반복문 ( for loop )  (0) 2023.07.08

 

배열 ->  for in, for of, forEach 아무 제약없이 사용 가능

객체 ->  for in 가능

  • Object.keys(객체).forEach(function(key){ 객체[key] })

for loop 를 이용해서 주어진 배열로 객체를 생성도 가능

const arr = ['a', 'b'];
const score = ['100', '90'];

// 주어진 배열로 객체 만들기
let myObject = {}
for( let i=0;  i < arr.length; i++){
	myObject[arr[i]] = score[i];
}

'프로그래밍 > JavaScript' 카테고리의 다른 글

콜백(callback)함수  (0) 2023.07.12
Function(함수)  (0) 2023.07.11
var, let, const  (0) 2023.07.09
반복문 ( for loop )  (0) 2023.07.08
2023 07 06 연산자 및 자료형 검사  (0) 2023.07.06

var 는 전역변수이며 같은 변수명으로 재 선언이 가능하지만, let 과 const는 재 선언이 불가능하고 블록단위 변수와 상수이다.

let 

  • 블록 단위 변수 선언 : { } 안에서 만 유효
  • 변수 값 변경 가능
  • 같은 변수명으로 재선언 불가능
// score가 선언되지 않아서 error를 발생
for (const idx in scores) {
    if (scores.hasOwnProperty.call(scores, idx)) {
      let score = scores[idx];
    }
    console.log(`${score}`);
}


// score가 선언 되어서 error 없이 실행됨
for (const idx in scores) {
    if (scores.hasOwnProperty.call(scores, idx)) {
      let score = scores[idx];
      console.log(`${score}`);
    }
}

const

  • 블록단위 상수(변수)선언
  • 변수 값 변경 불가능
    • 객체일경우 그 안에 있는 속성은 업데이트 가능
  • 같은 변수명으로 재선언 불가능
const myId = 'id'
const myOBJECT = {'key': 'value'};

myOBJECT.key = 'new value'

// error
myOBJECT = {'new_key': 'value'};

const myId = 'joey'

'프로그래밍 > JavaScript' 카테고리의 다른 글

Function(함수)  (0) 2023.07.11
배열 과 객체 의 for loop  (0) 2023.07.09
반복문 ( for loop )  (0) 2023.07.08
2023 07 06 연산자 및 자료형 검사  (0) 2023.07.06
backtick (` `)  (0) 2023.07.04

+ Recent posts