JS - ES6

ES 6バージョンの構文を理解します.
リファレンスソース:replit/説明の下の説明

Arrow function

名前の付いていない関数
//ES5
function() {}
//ES6
() => {}
ネーミング関数
//ES5
function getName() {}
//ES6
const getName = () => {}
呼び出し
getName()
因子を受け入れる場合
//ES5
const getName = function(name) {}
//ES6
const getName = (name) => {}
const getName = name => {}
因子が1つしかない場合は、括弧を省略できます.
2つの因子を省略することはできません.
//ES5
const getName = function(name,age){}
//ES6
const getName = (name,age) => {}
戻り関数
//ES5
function hi(text) {
text+=「やろう」;
return text;
}
//ES6
const hi = text => {
text+=「やろう」;
return text
};
明確な関数実行内容がなく、戻るだけであればreturnキーワードとカッコを省略できます.
//ES5
function getName(name) {
return name;
}
//ES6
const hi = name => { return name };
const hi = name => name;

矢印関数は使用できません。

オブジェクトを定義する方法は使用できません.

const obj = {
  name : 'Lee',
  sayName : () => { console.log(`hi + ${this.name}`);}
};
obj1.sayName();

このように書くと、オブジェクトのthisをバインドせずにグローバルオブジェクトがバインドされます.
に代わる

const obj = {
  name: 'Lee',
  sayHi : function(){
    console.log(`hi ${this.name}`);
  }
};

obj.sayHi();

addEventListener関数のコールバック関数では使用できません.
矢印関数のthisがwindowを参照しているからです.

let button = document.getElementById('myButton');

button.addEventListener('click', () => {  
  console.log(this === window); // => true
  this.innerHTML = 'Clicked button';
});
 
let button = document.getElementById('myButton');  
button.addEventListener('click', function() {  
  console.log(this === button); // => true
  this.innerHTML = 'Clicked button';
});

参考資料出所:https://jeong-pro.tistory.com/110

template literals, string method

template literals

stringを作成する場合は、back tickstringを包むこともできます.back tick小包で変数を入れて表現できます.

const name = '김개발';
cosnt hi = `안녕하세요. 저는 ${name}입니다.`;

使用変数は${}変数をかばう
<例>

function sayHello(name,age){
  return `Hello ${name} you are ${age} years old`;
}

const greetSunju = sayHello("Sunju",20)

console.log(greetSunju)

参考資料出所:YouTube「Nomad Coder」
( https://www.youtube.com/watch?v=mLTUtMARkqc&list=PLLUCyU7SBaR7tOMe-ySJ5Uu1UlEBznxTr&index=15 )
引用符で囲まれた文字列は、開行処理を行わず、構文エラーです.
たとえば、

let detail = '자세히
보아야
이쁘다';
console.log(detail);

間違いです.
template literalではstringが入力stringに書き換えられます.

let detail = `자세히 
보아야
이쁘다

내코드..`;
console.log(detail);

string method

stringを探すために、これまで使っていたindexOf現在ではstartsWith・endsWith・includesの3つの方法があります.

const email = '[email protected]';

console.log(email.startsWith('ye')); //true
console.log(email.endsWith('com')); //true
console.log(email.includes('@gmail')); //true

特定の文字列を繰り返す場合は、次の操作を行います.'#'.repeat(3);