Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
0
Help us understand the problem. What is going on with this article?
@totacho

Javascriptの関数定義

WHY

javascriptのカリキュラムは終えたが、いまいちピンとこないためにアウトプットの一環として書いていきます。


javascriptの関数定義を初心者なりにまとめてみます。

function

functionを用いることで関数を定義することができる。functionに続けて「関数名、(){ }」と記述していき、{}のなかに処理を書いていく。

function 関数名( ) {
  // 処理
}

//(例)
function sayHello(){
  console.log("こんにちは")
}

sayHello()

コンソールでの出力
js1.png

関数宣言

このように関数名を定義し、処理を書いていく定義を関数宣言という。

関数式

関数宣言は関数名を記述するのに対し、関数式の場合は、function(){}という無名の関数を変数に定義または代入して関数を定義する。

変数 = function( 引数 ){
  // 処理
}


無名関数

関数名なしで定義する。より簡潔なコードが記述できるというメリットがある。

// 関数宣言
function hello(){
  console.log('こんにちは')
}

// 関数式(無名関数)
const hello = function(){
  console.log('こんにちは')
}

即時関数

関数を定義すると同時に実行される。関数を定義してから呼び出すという作業を短縮することができる。

// 無名関数
const hello = function(text) {
  console.log(text)
}
  hello("こんにちは")

// 即時関数
(function hello(text) {
  console.log(text)
})("こんにちは")

アロー関数

functionの代わりに「()=>」という記述によって関数を定義する。より短い記述で関数定義をできる。

// 無名関数
const hello = function(text){
  console.log(text)
}

// アロー関数
const hello = (text) => {
  console.log(text)
}

javascriptはrubyと違い、関数名を定義する場所に関数名だけではなく、そのまま処理を記述することが多々あります。

//(例)
pullDownButton.addEventListener('mouseover', function(){
    console.log("mouseover OK")
  })

似ているようできちんと紐解いて学んでいこうとおもいます。

0
Help us understand the problem. What is going on with this article?
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
totacho
プログラミング学習中、アウトプット用

Comments

No comments
Sign up for free and join this conversation.
Sign Up
If you already have a Qiita account Login
0
Help us understand the problem. What is going on with this article?