TIL:ES 6矢印関数
実は今週の初学の内容です.ブログはいい加減で書けない.
週末に書いていない内容を復習して、書いてみてください.😙
昨日、オブジェクト向けプログラミングを勉強してから、矢印関数をもう一度見て、EZのように感じました.
やはり一度難しいことをした後は前の内容が簡単に見えます
1.矢印関数
矢印関数表現(arrow function expression)の構文は、関数表現よりも短く、独自のthis、arguments、super、またはnewを有する.targetをバインドしません.矢印関数は常に匿名です.この関数は、非メソッド関数に最も適していることを示します.ジェネレータとして使用できませんMDN矢印関数
引用の説明は分かりにくいので、以下に書いたコードを見て理解したほうがいいです.
関数式
const add = function (x, y) {
return x + y
}
矢印関数
const add = (x, y) => {
return x + y
}
関数式の機能を省略することができ、矢印=>
の形式で関数を容易に記述することができる.なお、関数本文にreturnのみの場合は、returnは省略してもよい.
{}
中括弧も省略可能!!const add = (x, y) => x + y // O, 정상 작동
const add = (x, y) => { x + y } // X, undefined 리턴
()
の括弧を使うことができます!一般式の「かっこ」と同じconst add = (x, y) => (x + y) // O, 정상 작동
ただし、関数の式が2行より多い場合は、省略ではなくretun、カッコを使用することが望ましい.(はい、そうです.省略された関数を見ると、実は急によく見えません.😅)
// bad 삐삐.. 알아보기 힘들다 ...
const getStudentAvg = arr => arr.filter(person => person.job === 'student').reduce((sum, person) => (sum + person.grade), 0)
// good
const getStudentAvg = arr => {
return arr
.filter(person => person.job === 'student')
.reduce((sum, person) => (sum + person.grade), 0)
}
2.矢印関数(モジュール)
矢印関数は、キャビネットが非常に良いことを示します!!
関数式
const adder = function(x) {
return function(y) {
return x + y
}
}
adder(5)(7) // 12
矢印関数
functionをスキップconst adder = (x) => {
return (y) => {
return x + y
}
}
returnをスキップ(一番奥から)
returnを省略するときは括弧を使わない!!const adder = x => {
return y => x + y
}
最後に残った部分も全部省略!!const adder = x => y => x + y
一列きれいに!
3.矢印関数のthis
(実は、この部分はまだ分かりません)
const adder = function(x) {
return function(y) {
return x + y
}
}
adder(5)(7) // 12
const adder = (x) => {
return (y) => {
return x + y
}
}
const adder = x => {
return y => x + y
}
const adder = x => y => x + y
(実は、この部分はまだ分かりません)
矢印関数にはこの項目はありません.
矢印関数はコンストラクション関数として使用できません.(newと合わせてXを使用)
パラメータはサポートされていません
の最後の部分
簡単で明瞭な関数式を書くには、矢印関数は本当に便利な文法のようです.
しかし,複雑なコードにおいて矢印関数のみを用いてすべての内容を省略できる場合,コードを迅速に理解することは困難である.実は上で表現した関数を見ているだけで、実は私は一目で理解しにくいです.
いずれにしても、新しい文法を学んで、習慣的によく使って、努力して熟知します.
最後の矢印関数は、さらに学習する必要があります.(まだわからない)😭😭😭)
Reference
この問題について(TIL:ES 6矢印関数), 我々は、より多くの情報をここで見つけました
https://velog.io/@smart5265988/TIL-ES6-화살표-함수
テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol
Reference
この問題について(TIL:ES 6矢印関数), 我々は、より多くの情報をここで見つけました https://velog.io/@smart5265988/TIL-ES6-화살표-함수テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol