Follow Us!!:

アプリなら、たくさんの便利な機能が無料で使える!
今すぐアプリをダウンロードして、もっと自由に学ぼう!

履歴の確認
お気に入り・フォローの登録
通知の受け取り
ファイルの作成・追加・複製
メモの作成・確認
モチベボードの投稿
App StoreからダウンロードGoogle Playで手に入れよう
運営会社お問い合わせ利用規約プライバシーポリシー

© 2025, okke, Inc.

キノコード / プログラミング学習チャンネル

【JavaScript超入門コース】12.関数 |関数を料理ロボットに例えて説明しました【プログラミング初心者向け入門講座】

次の動画:【JavaScript超入門コース】13.クラス|クラスとは、「データ」と「処理」をまとめたもの【プログラミング初心者向け入門講座】

概要

動画投稿日|2020年4月25日

動画の長さ|9:08

この動画では、JavaScriptの関数について説明します。文字の書き起こし、ソースコードも完全無料です。サイトでの登録なども一切不要です。概要欄の下部にサイトURLあります。 ▼目次 0:26 関数とは 1:17 関数の定義と実行 2:55 引数なしの関数 4:16 引数ありの関数 6:22 戻り値のある関数 6:45 複数の引数がある関数 8:03 確認問題 ▼関連動画 【JavaScript超入門コース】01.コース紹介(   • 【JavaScript超入門コース】01.コース紹介|初心者にわかりやすい...  ) 【JavaScript超入門コース】02.JavaScriptとは (   • 【JavaScript超入門コース】02.JavaScriptとは?|Ja...  ) 【JavaScript超入門コース】03.環境構築(for Mac) (   • 【JavaScript超入門コース】03.環境構築 for Mac|プログ...  ) 【JavaScript超入門コース】03.環境構築(for Windows) (   • 【JavaScript超入門コース】03.環境構築 for Windows...  ) 【JavaScript超入門コース】04.プログラムの基本構造 (   • 【JavaScript超入門コース】04.プログラムの3つの基本構造|プロ...  ) 【JavaScript超入門コース】05.実行 (   • 【JavaScript超入門コース】05.プログラム実行方法 |プログラム...  ) 【JavaScript超入門コース】06.変数 (   • 【JavaScript超入門コース】06.変数 |変数は、例えるなら「箱」...  ) 【JavaScript超入門コース】07.データ型 (   • 【JavaScript超入門コース】07.データ型 |変数に入れるデータの...  ) 【JavaScript超入門コース】08.配列 (   • 【JavaScript超入門コース】08.配列|変数を箱。配列をロッカーに...  ) 【JavaScript超入門コース】09.演算子 (   • 【JavaScript 超入門コース】09.演算子|足し算や引き算、2つの...  ) 【JavaScript超入門コース】10.条件分岐 (   • 【JavaScript超入門コース】10.条件分岐|条件にあてはまればAと...  ) 【JavaScript超入門コース】11.繰り返し (   • 【JavaScript超入門コース】11.繰り返し|同じ処理を何度も実行で...  ) 【JavaScript超入門コース】12.関数 (   • 【JavaScript超入門コース】12.関数 |関数を料理ロボットに例え...  ) 【JavaScript超入門コース】13.クラス (   • 【JavaScript超入門コース】13.クラス|クラスとは、「データ」と...  ) 【JavaScript超入門コース】14.実践 (   • 【JavaScript超入門コース】14.実践|すべて理解できればJava...  ) 【JavaScript超入門コース】15.総集編(   • JavaScript超入門コース 合併版【JavaScriptの超基本的な...  ) ▼各超入門コース 合併版(約1時間) 【Python超入門コース】(   • Python超入門コース 合併版|Pythonの超基本的な部分をたった1時...  ) 【JavaScript超入門コース】(   • JavaScript超入門コース 合併版【JavaScriptの超基本的な...  ) 【Java超入門コース】(   • Java超入門コース 合併版【Javaの超基本的な部分をたった1時間で学べ...  ) 【PHP超入門コース】(   • PHPのプログラミング初心者向けの超入門講座|たった1時間で学べる【文字書...  ) 【Go超入門コース】(   • 【たった1時間で学べる】Go言語のプログラミング初心者向けの超入門講座【文...  ) 【Ruby超入門コース】(   • 【たった1時間で学べる】Rubyのプログラミング初心者向けの超入門講座【文...  ) 【Kotlin超入門コース】(   • 【たった1時間で学べる】Kotlinのプログラミング初心者向けの超入門講座...  ) ▼自己紹介 現在:フリーランス(マーケティング関連の人工知能開発、データ分析や業務自動化など) 前職:リクルート ▼SNS Twitter : https://twitter.com/kino_code/likes Facebook : https://www.facebook.com/%E3%82%AD%E3%83%8E%E3%82%B3%E3%83%BC%E3%83%89-105693727500005/ Website : https://kino-code.com/ ▼文字書き起こし 関数とは? まず、関数について説明します。 関数とは、いろいろな「処理」をまとめて1つにしたものです。 なぜ関数があるのでしょうか? 料理で例えてみます。 例えば、いつも作るカレーがあるとします。 そのレシピを料理ロボットに記憶してもらいます。 またカレーが食べたくなったときに、 ボタン1つで作れる。 しかも、その料理ロボットは、自分も使えるし、家族も使える。 その料理ロボットが関数なのです。 関数の便利なところは色々あるのですが、3つあげてみます。 同じものを2回書く必要がない 同じものを他の場面で使える 関数の中のコードを理解していなくても他の人も使うことができる といった便利な点です。 関数を作ることを「関数を定義する」といいます。 JavaScriptでの関数の定義方法についてみていきましょう。 関数の定義方法 func 関数名( ) { 実行する処理 } JavaScriptでは関数の定義にfunctionを使います。 functionの後に関数につける名前を書き、丸括弧を書きます。 関数に引数を渡したい場合は、丸括弧のなかに引数名を書きます。 引数は、何個でも渡すことができるので、必要な分だけカンマで区切って入れることができます。 最後に{ }波括弧を書いて、波括弧のなかに実行する処理を書きます。 関数の宣言と実行 それでは、実際に、コードを書いてみましょう。 function say_hello() { console.log("Hello World"); } say_hello(); 文字列の「Hello World」を表示する関数を作成していきましょう。 まずは function、そのあとに関数名を書きましょう。 関数名はメッセージを表示する意味を持つ「say_hello」を書きます。 今回、引数はないので丸括弧のみを書きます。 波括弧を書いて、実行する処理を書きます。 これで関数を定義することができました。 関数を実行するには、関数名、丸括弧を記述することができます。 関数名の「say_hello」に引数なしの丸括弧。これで「Hello World」が表示されるはずです。 実行してみましょう。 「Hello World」を表示することができました。 function say_hello() { console.log("Hello World"); } say_hello(); say_hello(); say_hello(); 定義した関数は何度でも呼び出すことができます。 3回、say_helloを記述しましょう。 「Hello World」は3回表示されるはずです。 実行してみましょう。 「Hello World」を3回表示することができました。 関数式 関数式では変数名、イコール、function、そのあとに関数名を書きます。 そのあとに、丸括弧を書き、波括弧。波括弧の中に、実行する処理を書きます。 波括弧の後に「;」(セミコロン)が必要なので、注意しましょう。 あいさつを表示する関数式を、コードを書いて作ってみましょう。 var hello= function say_hello() { console.log("Good Morning"); }; hello(); 変数名はあいさつという意味の「hello」とします。 関数名は「say_hello」としましょう。 functionのあとに関数名、丸括弧。丸括弧の中には引数を書くことができます。 波括弧を書いて、実行する処理を書きます。表示させる文字列は「Good Morning」としましょう。 波括弧の後に「;」(セミコロン)を書きます。 関数式を実行するときは、変数名、丸括弧を書きます。 変数名の「hello」に丸括弧を書きます。 実行してみましょう。「Good Morning」が表示されました。 var hello = function() { console.log("Good Morning"); }; hello(); 関数式は関数名を省略することができます。 関数名の「say_hello」を省略しましょう。 実行してみましょう。 関数名を省略してもエラーにならず表示することができました。 ※続きは、文字書き起こしブログで ▼文字書き起こし&ソースコードは下記ブログ https://kino-code.com/course-javascript12-function/ ▼タグ #JavaScript初心者 #プログラミング入門 #関数

タグ

#高1#高2#高3#大学#レベル2#JavaScript#講義

関連動画

9:59
【Python超入門コース】12.関数 |関数を料理ロボットに例えて説明しました【プログラミング初心者向け入門講座】キノコード / プログラミング学習チャンネル
31:12
【Python入門 #7】関数 | 処理を使いまわそうだれでもエンジニア / 山浦清透
4:03
【関数def Part1】授業でpython27 約4分 【引数】【関数】【戻り値】ケミカル
10:13
【高校情報Ⅰ】プログラミング 関数_Python編(引数、戻り値)|共通テスト完全攻略勉強法_133P【情報Ⅰ】アニメの教科書で共通テスト対策授業【ルークススクール】勉強法や高校、大学受験対策
9:20
【情報Ⅰ授業動画】4-(14) Python演習⑤関数【関数・引数・戻り値・再帰関数】【情報Ⅰ】解説動画

関連用語