JavaScriptのreturnメソッドを詳しく解説-jsチュートリアル-php.cn

ホームページ

ウェブフロントエンド

jsチュートリアル

JavaScriptのreturnメソッドを詳しく解説

醉折花枝作酒筹

Jun 09, 2021 am 11:55 AM

javascript return

js では、return メソッドは現在の関数を終了し、現在の関数の値を返します。構文形式は「return [[expression]];」です。 return は式の値を返しますが、これを無視した場合、つまり "return;" を指定した場合は unknown を返します。

JavaScriptのreturnメソッドを詳しく解説

このチュートリアルの動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。

最近、フロントエンドを勉強している友人から、関数の return の使い方や意味を漠然と理解している人が多いと聞きましたので、return の使い方について皆さんと議論するためにここにブログを書きます。

1. 定義

return、文字通り「return」を意味します。公式定義の return ステートメントは、現在の関数を終了し、現在の関数の値を返します。以下を参照してください。サンプルコード:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
      <title>Title</title>
      <script>
         function func1(){
              while (true){
                  return 1;
             }
         };
         alert(func1());
     </script>
 </head>
 <body>
 
 </body>
 </html>

ログイン後にコピー

関数内に無限ループを記述し、以下で呼び出したことがわかります。return ステートメントが記述されていない場合、ブラウザは常にループ内のステートメントを実行し、直接スタックします。 ;

return ステートメントを記述した後、関数は直接中断され、値 1 が関数に返されます。これは、関数の実行後、関数本体に関数の戻り値が割り当てられることを意味します。ここでは 1 が返されます;

2. 書き方

return の正式な定義の後には、次のように続きます。値。つまり、JavaScript で値を続けることができます。任意のデータ型、数値、文字列、オブジェクトなど。もちろん、関数を返すこともできます。例:

  <!DOCTYPE html>
  <html lang="en">
  <head>
      <meta charset="UTF-8">
      <title>Title</title>
      <script>
          function func1(){
              return function (){
                  alert(1);
             }
         };
         alert(func1());  //!func1()();   这个注释是通过自执行函数调用返回的函数
         </script>
 </head>
 <body>
 
 </body>
 </html>

ログイン後にコピー

サンプル画像:

# もちろん関数であれば呼び出すことができますので、次のように書くこともできます。 func1()(); これは理解するのが簡単です。 func1(); を出力すると、これは return が続く無名関数です。その後、自己実行関数の形式で呼び出すことができます。ここに渡されます。関数 body(); の形式で呼び出されます。

#3. 演習

return ステートメントを使用してループを実装します。

アイデア: return ステートメントは関数を返すことができるということは、それ自体を返すことができ、後で呼び出すとループ関数を実現できることを意味します;

  <!DOCTYPE html>
  <html lang="en">
  <head>
      <meta charset="UTF-8">
      <title>Title</title>
      <script>
          var i=1;      //定义循环变量
          function func1(){
              i++;       //改变循环变量
             if(i<5){　　　　　　　　//小括号为循环条件
                 document.write(i+&#39;<br>');      //这里是循环体
                 return func1();
             }                 
         }
         !func1()();               //调用函数
</script>
 </head>
 <body>
 
 </body>
 </html>

ログイン後にコピー

の各部分の関数ループコード内のコメントに関数が記述されています。ブロガーは自分で試すことができます。以下は実行レンダリングです。

#4. 定義します。 javascript auto メソッド内のコールバック関数

return の使用法については既に詳細に学習しました。次に、JavaScript 独自のメソッド内のコールバック関数を学習します。ここでは、配列内の sort(); を使用します。並べ替えメソッドの例:

sort() で、配列の並べ替え規則を指定するコールバック関数を作成できることは周知のとおりです。サンプルコード:

  <!DOCTYPE html>
  <html lang="en">
  <head>
      <meta charset="UTF-8">
     <title>Title</title>
      <script>
          var arr = [1,3,2,6,5];
          arr.sort(function(a,b){
              return a-b;
         });
         console.log(arr); 
</script>
 </head>
 <body>
 
 </body>
 </html>

ログイン後にコピー

実行レンダリング:

それでは、なぜこんなことが起こるのでしょうか? return と何の関係があるのでしょうか? 悩んでいるブロガーも多いと思いますが、実験して return の後の a-b を -1 に置き換えてみましょう。 ; 変更が小さい場合、コードはアップロードされなくなります。友人は手動で変更できます。

実行レンダリング:

これは、いつでも確認できます。 a 負の数が -1 の場合、変化は起こりません。以下では、return 後の a-b を 0 に置き換えます。

実行レンダリング:

ご覧のとおりです。 0 が返された場合、変更は発生しません。以下では、戻り後の a-b を正の数 1 に置き換えます。

実行レンダリング:

次のことができます。を参照してください。1 が返されると、配列の順序が逆になります。

次に、次の結論を導き出すことができます:

a-b<=0 の場合、a が前にあり、b が前にあります。は後ろにあります;

a-b>0 の場合、a は後、b は前になります;

この時点で、a と b とは何かという疑問を持つブロガーもいるはずです。次のコードが出力されます:

  <!DOCTYPE html>
  <html lang="en">
  <head>
      <meta charset="UTF-8">
      <title>Title</title>
      <script>
          var a = [1,3,2,6,5];
          a.sort(function(a,b){
              console.log('a是:'+a+'\t b是:'+b+'<br>');
             return a-b;
         });
         console.log(a);
</script>
 </head>
 <body>
 
 </body>
 </html>

ログイン後にコピー

Execution rendering:

return a-b; 昇順を詳細に分析し、return b-a降順; 非常に簡単で、端的に言えば return -(a-b)、つまり a-b を基準に降順に反転するだけです。

ここで全体的な結論を導き出すことができます。返される値は数値です。sort(); メソッドは、正の値と負の値に従って配列の各部分を並べ替えます。

[推奨学習: JavaScript 上級チュートリアル]

以上がJavaScriptのreturnメソッドを詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

ホットツール

ホットトピック

Gmailメールのログイン入り口はどこですか？

7467

CakePHP チュートリアル

1376

Steamのアカウント名の形式は何ですか

Win11 Activation Key Permanent

NYTの接続はヒントと回答です

Related knowledge

WebSocket と JavaScript を使用してオンライン音声認識システムを実装する方法 Dec 17, 2023 pm 02:54 PM

WebSocket と JavaScript を使用してオンライン音声認識システムを実装する方法はじめに: 技術の継続的な発展により、音声認識技術は人工知能の分野の重要な部分になりました。 WebSocket と JavaScript をベースとしたオンライン音声認識システムは、低遅延、リアルタイム、クロスプラットフォームという特徴があり、広く使用されるソリューションとなっています。この記事では、WebSocket と JavaScript を使用してオンライン音声認識システムを実装する方法を紹介します。

WebSocket と JavaScript: リアルタイム監視システムを実装するための主要テクノロジー Dec 17, 2023 pm 05:30 PM

WebSocketとJavaScript：リアルタイム監視システムを実現するためのキーテクノロジーはじめに：インターネット技術の急速な発展に伴い、リアルタイム監視システムは様々な分野で広く利用されています。リアルタイム監視を実現するための重要なテクノロジーの 1 つは、WebSocket と JavaScript の組み合わせです。この記事では、リアルタイム監視システムにおける WebSocket と JavaScript のアプリケーションを紹介し、コード例を示し、その実装原理を詳しく説明します。 1.WebSocketテクノロジー

WebSocketとJavaScriptを使ったオンライン予約システムの実装方法 Dec 17, 2023 am 09:39 AM

WebSocket と JavaScript を使用してオンライン予約システムを実装する方法今日のデジタル時代では、ますます多くの企業やサービスがオンライン予約機能を提供する必要があります。効率的かつリアルタイムのオンライン予約システムを実装することが重要です。この記事では、WebSocket と JavaScript を使用してオンライン予約システムを実装する方法と、具体的なコード例を紹介します。 1. WebSocket とは何ですか? WebSocket は、単一の TCP 接続における全二重方式です。

JavaScript と WebSocket を使用してリアルタイムのオンライン注文システムを実装する方法 Dec 17, 2023 pm 12:09 PM

JavaScript と WebSocket を使用してリアルタイムオンライン注文システムを実装する方法の紹介: インターネットの普及とテクノロジーの進歩に伴い、ますます多くのレストランがオンライン注文サービスを提供し始めています。リアルタイムのオンライン注文システムを実装するには、JavaScript と WebSocket テクノロジを使用できます。 WebSocket は、TCP プロトコルをベースとした全二重通信プロトコルで、クライアントとサーバー間のリアルタイム双方向通信を実現します。リアルタイムオンラインオーダーシステムにおいて、ユーザーが料理を選択して注文するとき

JavaScript と WebSocket: 効率的なリアルタイム天気予報システムの構築 Dec 17, 2023 pm 05:13 PM

JavaScript と WebSocket: 効率的なリアルタイム天気予報システムの構築はじめに: 今日、天気予報の精度は日常生活と意思決定にとって非常に重要です。テクノロジーの発展に伴い、リアルタイムで気象データを取得することで、より正確で信頼性の高い天気予報を提供できるようになりました。この記事では、JavaScript と WebSocket テクノロジを使用して効率的なリアルタイム天気予報システムを構築する方法を学びます。この記事では、具体的なコード例を通じて実装プロセスを説明します。私たちは

簡単な JavaScript チュートリアル: HTTP ステータスコードを取得する方法 Jan 05, 2024 pm 06:08 PM

JavaScript チュートリアル: HTTP ステータスコードを取得する方法、特定のコード例が必要です序文: Web 開発では、サーバーとのデータ対話が頻繁に発生します。サーバーと通信するとき、多くの場合、返された HTTP ステータスコードを取得して操作が成功したかどうかを判断し、さまざまなステータスコードに基づいて対応する処理を実行する必要があります。この記事では、JavaScript を使用して HTTP ステータスコードを取得する方法を説明し、いくつかの実用的なコード例を示します。 XMLHttpRequestの使用

JavaScriptでinsertBeforeを使用する方法 Nov 24, 2023 am 11:56 AM

使用法: JavaScript では、insertBefore() メソッドを使用して、DOM ツリーに新しいノードを挿入します。このメソッドには、挿入される新しいノードと参照ノード (つまり、新しいノードが挿入されるノード) の 2 つのパラメータが必要です。

JavaScript で HTTP ステータスコードを簡単に取得する方法 Jan 05, 2024 pm 01:37 PM

JavaScript で HTTP ステータスコードを取得する方法の紹介: フロントエンド開発では、バックエンドインターフェイスとの対話を処理する必要があることが多く、HTTP ステータスコードはその非常に重要な部分です。 HTTP ステータスコードを理解して取得すると、インターフェイスから返されたデータをより適切に処理できるようになります。この記事では、JavaScript を使用して HTTP ステータスコードを取得する方法と、具体的なコード例を紹介します。 1. HTTP ステータスコードとは何ですか? HTTP ステータスコードとは、ブラウザがサーバーへのリクエストを開始したときに、サービスが

See all articles

JavaScriptのreturnメソッドを詳しく解説

ホットAIツール

Undresser.AI Undress

AI Clothes Remover

Undress AI Tool

Clothoff.io

AI Hentai Generator

人気の記事

ホットツール

メモ帳++7.3.1

SublimeText3 中国語版

ゼンドスタジオ 13.0.1

ドリームウィーバー CS6

SublimeText3 Mac版

ホットトピック