[es6] arrow function (미완성)

Woo Hwukjun·2021년 1월 18일
0

1. ES6 = ECMA Script 2015

  • ES는 ECMA Script의 줄임말입니다. ECMA Script는 JavaScript를 표준화 시키려고 탄생했습니다.(ECMAScript (or ES) is a scripting-language specification standardized by Ecma International)
  • ES6에서는 function이라는 키워드가 빠지고 소괄호만 남았습니다. 그리고 =>(arrow) 가 추가되었습니다.
//ES5
function getName() {}
//ES6
const getName = () => {}

function(함수)는 변수에 저장할 수 있는 하나의 식입니다.

//ES5
const getName = function(name) {}
//ES6
const getName = (name) => {} // 인자가 두 개일 때는 생략할 수 없습니다.
const getName = name => {} //인자가 하나일 때는 소괄호 생략이 가능합니다.
//ES5
function hi(text) {
  text += '하세요';
  return text;
}
//ES6
const hi = text => { 
  text += '하세요';
  return text 
};
//ES5
function getName(name) {
  return name;
}
//ES6
const hi = name => { return name };
const hi = name => name; //만약 함수가 실행내용이 딱히 없이 return만 한다면 return 키워드와 중괄호가 생략가능합니다

중괄호와 return문이 생략될 경우, 화살표 오른쪽에는 리턴될 "값"만 쓰여야 합니다. 다른 코드가 들어가면 안됩니다.

template literals, string method

  • 이제 back tick으로도 string을 감쌀 수 있습니다. (``)
  • Another advantage of using backticks is that they allow a string to span multiple lines: let guestList = `Guests:* John* Pete* Mary`;
  • 그리고 back tick 으로 감싸면 그 안에 변수를 넣어서 표현할 수 있습니다. 변수를 사용하려면 ${} 으로 변수를 감싸줘야 합니다.
    const hi = `안녕하세요. 저는 ${name} 입니다.`;
  • break line \n
  • template literal에서는 string을 입력한대로 개행이 됩니다.

string method

const email = 'yealee.kim87@gmail.com';
console.log(email.startsWith('ye'));
console.log(email.endsWith('com'));
console.log(email.includes('@gmail'));
'#'.repeat(3); //특정 문자열을 반복하고 싶으면 repeat 함수를 쓰면 됩니다

array methods

  • callback 함수란, 인자로 전달되는 함수라고 생각하시면 됩니다.

Array.map()

  • map 메서드는 배열을 반복해주는데, callback 함수에서 return한 값으로 매(each) 요소를 수정해줍니다.
  • map 메서드의 return값은 수정된 값으로 다시 생성된 배열입니다.
const arr = [1, 2, 3];
const squares = arr.map(x => x * x);
// map함수에 인자로 넘어간 함수를 원래대로 표현하면 아래와같다.
const squares = arr.map(function (x) { 
  return x * x;
});

# Array.forEach()

profile
미래 개발자

0개의 댓글