【JavaScriptチュートリアル】JavaScript関数-jsチュートリアル-php.cn

【JavaScriptチュートリアル】JavaScript関数

黄舟

リリース： 2016-12-24 14:50:05

オリジナル

907 人が閲覧しました

JavaScript 関数

関数は、呼び出されたときに実行されるイベント駆動型または再利用可能なコードのブロックです。

例

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction()
{
alert("Hello World!");
}
</script>
</head>

<body>
<button onclick="myFunction()">Try it</button>
</body>
</html>

ログイン後にコピー

JavaScript 関数の構文

関数は、前にキーワード function が使用されている、中括弧で囲まれたコードのブロックです。

function functionname()
{
执行代码
}

ログイン後にコピー

関数が呼び出されると、関数内のコードが実行されます。

関数は、イベントが発生したとき (ユーザーがボタンをクリックしたときなど) に直接呼び出すことができ、JavaScript によってどこからでも呼び出すことができます。

JavaScriptでは大文字と小文字が区別されます。キーワード function は小文字である必要があり、関数は関数名と同じ大文字と小文字を使用して呼び出される必要があります。

パラメータを使用して関数を呼び出す

関数を呼び出すとき、パラメータと呼ばれる値を渡すことができます。

これらのパラメータは関数で使用できます。

カンマ (,) で区切って、好きなだけパラメータを送信できます:

myFunction(argument1,argument2)

ログイン後にコピー

関数を宣言するときは、パラメータを変数として宣言します:

function myFunction(var1,var2)
{
代码
}

ログイン後にコピー

変数とパラメータは同じ順序で指定する必要があります。最初の変数は、渡された最初のパラメータの指定された値であり、以下同様です。

例

<button onclick="myFunction(&#39;Harry Potter&#39;,&#39;Wizard&#39;)">Try it</button>

<script>
function myFunction(name,job)
{
alert("Welcome " + name + ", the " + job);
}
</script>

ログイン後にコピー

上記の関数は、ボタンをクリックすると「ようこそ、魔法使いハリー・ポッター」というプロンプトを表示します。

この関数は柔軟で、さまざまなパラメーターを指定して呼び出すことができ、さまざまなメッセージが表示されます:

例

<button onclick="myFunction(&#39;Harry Potter&#39;,&#39;Wizard&#39;)">Try it</button>
<button onclick="myFunction(&#39;Bob&#39;,&#39;Builder&#39;)">Try it</button>

ログイン後にコピー

クリックしたさまざまなボタンに応じて、上記の例では「ようこそハリー・ポッター、魔法使い」または「ようこそボブ、ビルダー。」

戻り値のある関数

関数が呼び出された場所に値を返したい場合があります。

これは return ステートメントを使用して実現できます。

return ステートメントを使用すると、関数は実行を停止し、指定された値を返します。

構文

function myFunction()
{
var x=5;
return x;
}

ログイン後にコピー

上記の関数は値 5 を返します。

注: JavaScript 全体の実行は停止されません。関数のみが停止されます。 JavaScript は、関数が呼び出された場所からコードを実行し続けます。

関数呼び出しは戻り値に置き換えられます:

var myVar=myFunction();

ログイン後にコピー

myVar 変数の値は 5 で、これは関数 "myFunction()" によって返される値です。

変数として保存しなくても、戻り値を使用できます:

document.getElementById("demo").innerHTML=myFunction();

ログイン後にコピー

"demo" 要素の innerHTML は、関数 "myFunction()" によって返される値である 5 になります。

関数に渡されたパラメータに基づいて戻り値を作成できます:

例

2 つの数値の積を計算し、結果を返します:

function myFunction(a,b)
{
return a*b;
}

document.getElementById("demo").innerHTML=myFunction(4,3);

ログイン後にコピー

"demo" 要素の innerHTML は次のようになります:

ログイン後にコピー

必要に応じて、関数を終了するときに return ステートメントを使用することもできます。戻り値はオプションです:

function myFunction(a,b)
{
if (a>b)
  {
  return;
  }
x=a+b
}

ログイン後にコピー

a が b より大きい場合、上記のコードは関数を終了し、a と b の合計を計算しません。

ローカル JavaScript 変数

JavaScript 関数内で宣言された変数 (var を使用) はローカル変数であるため、関数内でのみアクセスできます。 (この変数のスコープはローカルです)。

変数が宣言されている関数のみが変数を認識するため、異なる関数で同じ名前のローカル変数を使用できます。

関数の実行が完了すると、ローカル変数はすぐに削除されます。

グローバル JavaScript 変数

関数の外で宣言された変数はグローバル変数であり、Web ページ上のすべてのスクリプトと関数からアクセスできます。

JavaScript 变量的生存期

JavaScript 变量的生命期从它们被声明的时间开始。

局部变量会在函数运行以后被删除。

全局变量会在页面关闭后被删除。

向未声明的 JavaScript 变量分配值

如果您把值赋给尚未声明的变量，该变量将被自动作为全局变量声明。

这条语句：

carname="Volvo";

ログイン後にコピー

将声明一个全局变量 carname，即使它在函数内执行。

以上就是【JavaScript教程】JavaScript 函数的内容，更多相关内容请关注PHP中文网（www.php.cn）！

php 8、私も来ます

ウェブサイトのレイアウトを 30 分で学ぶ

ビデオチュートリアルに精通したOracleの入門

あなたの最初のUNI-APPコード

ゼロからアプリの起動までフラッター

兄弟連新版Linuxビデオチュートリアル

AXURE 9 ビデオチュートリアル (プロダクトマネージャーのインタラクティブな製品設計 UI に適しています)

基礎能力ゼロ PS ビデオチュートリアル

16日間のUIビデオチュートリアル

PS テクニックとスライステクニックのビデオチュートリアル

アリクラウド環境構築およびプロジェクトオンラインビデオチュートリアル

コンピュータネットワークの概要 - プログラマが身につけるべき基礎知識

プログラマーのための基本チュートリアル - HTTP プロトコルの説明

Websocket ビデオチュートリアル

【JavaScriptチュートリアル】JavaScript関数