ホームページ > 記事 > ウェブフロントエンド > JavaScriptの厳選変数基礎（超詳しく学びシェア！）

JavaScriptの厳選変数基礎（超詳しく学びシェア！）

WBOYオリジナル: 2021-10-12 17:24:481970ブラウズ

この記事では JavaScript 変数の基本について説明します。まず、変数の基本的な概念とスカラーのデータ型について説明します。皆さんのお役に立てれば幸いです。一緒に働きましょう!

#変数

##1.1 変数の概念:

変数は、プログラム内の名前付きストレージユニットを指します。その主な機能は、データ操作のための情報を格納するためのコンテナを提供することです。変数は、データを保持するコンテナーと考えることができます。

1.2 変数の宣言と代入

JavaScript では変数を使用する前に宣言する必要があり、変数の宣言にはシステムキーワード var を使用します。変数を宣言するときは、代入番号 "

=" を使用して変数に値を割り当てることもできます。構文形式は次のとおりです:

var 变量名 = 变量值

例:

var  name ;  //声明一个变量
var name,city,like ; //声明多个变量，多个变量之间用英文状态下的逗号分开
var name = "阿泽"; //声明一个变量并且赋值

1.3 変数の命名規則

変数は数字で始めることはできません。文字またはアンダースコアで始めることはできます。
#JavaScript 変数名では大文字と小文字が区別されます。
JavaScript ではキーワードを変数名として使用できません。

#2. 変数のデータ型

変数の型の鍵は値の型にあります。

2.1 数値型

数値型変数は、整数型、浮動小数点型、NaN

などの数学的演算に使用できます。例:

var a = 10;
var y = 0.1;
var x = 100;

さらに特別なものは、NaN (非数値) は数値ではありません。他のデータ型を数値型に変換する場合、変換は実行できませんが、プログラムはエラーを報告できず、この場合は NaN 値が返されます。次の状況:

<html>
      <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>php.cn</title>
        <script>
           var length = "500m";
           length = length*5;
           document.write(length);
        </script>
    </head>
    <body>
    </body>
</html>

今度は、何かの長さを元の長さの 5 倍にしたいとします。文字列は意味のある値に変換できず、NaN にのみ変換できます

数値の文字列は、意味のある値に変換できません。長さを意味のある数値に変換し、純粋な数値の文字列に変更して表示結果を出力することができます。

2.2 文字の種類

一重引用符または二重引用符で囲まれた文字列。

一重引用符と二重引用符は相互にネストできることに注意してください。一重引用符の中にネストできるのは二重引用符のみ、二重引用符の中にネストできるのは一重引用符だけです。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script>
    var name = "阿泽";
            var str = "我的名字是&#39;" +name+"&#39;"
            document.write(str)
    </script>
   </head>
<body>
    </body>
</html>

プラス記号は文字列コネクタです。二重引用符の中に二重引用符を入れ子にしたい場合は、内側の二重引用符をエスケープする必要があります (\")。JS のエスケープ文字は

バックスラッシュ (\ ) .

で一般的に使用されるエスケープ文字は次のとおりです:

\'、\"、\\ 、\r 、\n など。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script>
    var name = "阿泽";
            var str =  "我的名字叫做\"" +name+"\""
            document.write(str)
    </script>
   </head>
<body>
    </body>
</html

2.3 ブール型

ブール型は論理型とも呼ばれます。値は true (真)、偽 (偽) の 2 つだけです。つまり、照明スイッチ、性別などの 2 つの状態です。

var a = true;
var b = false

ブール型は、if 条件判定ステートメントでよく使用されます。例:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script>
     var a = 10;
           var b = 110;
           if(x>y){
               document.write(a+"比"+b+"大");
           }else{
               document.write(b+"比"+a+"大");
           }
    </script>
   </head>
<body>
    </body>
</html>

2.4 未定義型

未定義型は A

unknown のみです。

変数が定義されていて値が割り当てられていない場合は、未定義として返されます。オブジェクトの属性が存在しない場合も、未定義として返されます。

例: 未定義の割り当て

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script>
      var x;
           document.write(x);
    </script>
   </head>
<body>
    </body>
</html>

2.5 空の型

空の型には値が 1 つだけあります:

null。

オブジェクトが存在しない場合は null 型が返されますが、変数の値をクリアしたい場合は null 値を代入できます。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script>
      var x = null;
     var a = 100;
     var a = null ;
     document.write(x);
     document.write(a);
    </script>
   </head>
<body>
    </body>
</html>

[推奨学習:

JavaScript 上級チュートリアル]

以上がJavaScriptの厳選変数基礎（超詳しく学びシェア！）の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明：

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

前の記事：jqueryの要素にCSSスタイルを設定する方法次の記事：jqueryの要素にCSSスタイルを設定する方法

続きを見る

JavaScriptの厳選変数基礎（超詳しく学びシェア！）

#変数

関連記事