English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

JavaScriptを学ぶために毎日学ぶべき基本知識

基本概念 

JavaScriptは解釈型の言語であり、ブラウザが解釈器として機能します。jsが実行されるとき、同じスコープ内ではまず解釈してから実行します。解釈の際にはfunctionとvarこれらのキーワードで定義された変数をコンパイルし、コンパイルが完了すると上から下に実行し、変数に値を代入します。 

大文字と小文字を区別 

ECMASCriptでは、変数、関数名、演算子などすべてが大文字と小文字を区別します。 

1. 変数 

変数は最初に使用されたときにメモリに設定され、後でスクリプトで参照するのに便利です。変数を使用する前にまず宣言を行います。varキーワードを使用して変数の宣言ができます。

var count, amount, level; // 単一のvarキーワードで宣言された複数の宣言 

変数の命名 

変数名にはグローバル変数、ローカル変数、クラス変数、関数の引数などが含まれます。これらはすべてこのカテゴリに属します。 

変数の命名はタイプ接頭辞で行います+意味のある単語で構成され、キャメルケース形式を使用して変数と関数の可読性を高めます。例:sUserName、nCount。
プレフィックス規則:
各ローカル変数にはタイププレフィックスが必要で、タイプに応じて以下のように分類されます:
s:文字列を表します。例:sName、sHtml;
n:数値を表します。例:nPage、nTotal;
b:論理を表します。例:bChecked、bHasLogin;
a:配列を表します。例:aList、aGroup;
r:正規表現を表します。例:rDomain、rEmail;
f:関数を表します。例:fGetHtml、fInit;
o:未記載の他のオブジェクトを表します。例:oButton、oDate;
g:グローバル変数を表します。例:gUserName、gLoginTime;

JScriptは大文字と小文字を区別する言語です。合法な変数名を作成するには以下の規則に従います: 

注意:最初の文字は数字ではありません。 

任意のアルファベットや数字、アンダースコアが続くことができますが、スペースは使用できません。変数名は予約語ではありえません。

JavaScriptは弱い型言語であり、JavaScriptは余分なスペースを無視します。スクリプトの可読性を向上させるために、スペースを追加することができます。 

varはJavaScriptの予約語であり、次に変数の説明が続くことを示します。変数名はユーザーがカスタムの識別子を使用して定義し、変数はカンマで区切ります。 

変数を宣言したが値を割りり当てていない場合、その変数は存在し、その値はJscriptの値undefinedです。

強制型変換 

Jscriptでは、異なるタイプの値に対して演算を行うことができます。JScriptエンジンが例外を発生させることが心配ありません。逆に、JScriptエンジンは自動的にデータタイプの1つを別のデータタイプに強制的に変換し、その後演算を行います。例えば:

 演算

数値と文字列を足すと、数値は強制的に文字列に変換されます。
ボルン値と文字列を足すと、ボルン値は強制的に文字列に変換されます。
数値とボルン値を足すと、ボルン値は強制的に数値に変換されます。

文字列を明示的に整数に変換するには、parseIntメソッドを使用します。文字列を明示的に数字に変換するには、parseFloatメソッドを使用します。 

JavaScriptの変数の生存期間:関数内で変数を宣言すると、その変数はその関数内でのみアクセスできます。関数から退出すると、その変数は取り消されます。このような変数はローカル変数と呼ばれます。異なる関数で同じ名前のローカル変数を使用できますが、それは変数を宣言した関数のみがその中の各変数を認識できるためです。 

関数の外で変数を宣言した場合、ページ上のすべての関数がその変数にアクセスできます。これらの変数の生存期間は宣言された後に始まり、ページが閉じられるときに終了します。 

js変数思维导图

 

2.jsのデータ型 

jscriptには三つの->主要データ型、二つの->複合データ型と二つの->特殊データ型。 

主要(基本)データ型
文字列
数値
ブール

複合(参照)データ型
 オブジェクト
配列

特殊データ型
Null

`Undefined`

文字列データ型:文字列データ型はJScriptでのテキストを表すために使われます。jsでは、ダブルクォート("")とシングルクォート('')で文字列を表すことができますが、ほとんど違いはありませんが、文字列を表す際にはダブルクォート("")を使用することが最適とされています。 

文字列値は一連のUnicode文字(文字、数字、記号)で構成されています。 

Unicodeとは何ですか? 

Unicodeは各文字にユニークな数値を提供しており、プラットフォームやプログラム、言語に関係なくです。Unicodeは、世界中で存在するすべての文字を処理するための統一されたエンコーディングを開発するために作成されました。 

数値データ型 

私たちが理解する必要があるのは、JScript内部ではすべての数値が浮動小数点数として表現されているため、Jscriptでは整数と浮動小数点数には違いがありません。 

Booleanデータ型 

ブール(論理)はtrueまたはfalseの二つの値しか持たないことができます。 

js配列とオブジェクト 

詳細はこの記事をご覧ください->javascript学習要約— —配列とオブジェクトの部分 

Nullデータ型:変数にnull値を割り当てることで変数の内容をクリアできます。 

Jscriptではtypeof演算子はnullの値をオブジェクト型として報告し、null型ではありません。

 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
 <title></title>
 <script type="text"/javascript"> 
   alert(typeof null);
 </script>
</head>
<body>
</body>
</html> 

nullはまだ存在していないオブジェクトを表すために使われ、関数が存在しないオブジェクトを返すことを試みた場合によく使われます。 

未定義データ型: 

以下の状況ではundefined値が返されます:
オブジェクトの属性が存在しません。
変数を宣言しましたが、値が割り当てられていません。

nullとundefinedの違い

alert(typeof undefined); //出力「undefined」 
alert(typeof null); //出力「object」 
alert(null == undefined); //出力「true」 

ECMAScriptはundefinedがnullから派生したと考え、それらを等しく定義しています。

alert(null === undefined); //出力「false」 
alert(typeof null == typeof undefined); //出力「false」 

nullとundefinedのタイプは異なりますので、出力「false」です。そして、===は絶対に等しいことを表し、ここでnull === undefinedはfalseを返します。 

また、ここで非常に重要なデータタイプであるリファレンスデータタイプを紹介します。 

リファレンスデータタイプ 

JavaScriptのリファレンスデータタイプはヒープメモリに保存されたオブジェクトであり、JavaScriptは直接ヒープメモリ空間の位置やその操作にアクセスすることを許可しません。オブジェクトのスタックメモリのリファレンスアドレスを操作することでしかアクセスできません。したがって、リファレンスデータタイプのデータは、スタックメモリに保存されているのは実際にはヒープメモリのオブジェクトのリファレンスアドレスであり、このリファレンスアドレスを通じて、ヒープメモリに保存されたオブジェクトを素早く検索することができます。 

以下にこのリファレンスデータタイプの割り当てプロセスを説明します。

 

もちろん、objに2name属性を追加することは、実際にはヒープメモリのオブジェクトにname属性を追加することです。obj2とobj1スタックメモリにはヒープメモリのオブジェクトのリファレンスアドレスが保存されていますが、コピーはされていますが、指しているオブジェクトは同じです。したがって、objを変更すると、objも変更されます。2objが引き起こしました。1の変更。 

基本タイプの値は、スタックメモリに保存されているシンプルなデータセグメントを指し、その値はメモリの1つの位置に完全に保存されています。
 リファレンスタイプの値は、実際にはヒープメモリに保存されているオブジェクトを指し、変数に保存されているのは実際にはポインタだけであり、そのポインタはメモリの別の場所を指し、その場所にはオブジェクトが保存されています。 

要約すると、ヒープメモリはリファレンス値を保存し、スタックメモリは固定タイプの値を保存します。

 

ECMAScriptでは、変数には2種類の値が存在します。それは原始値とリファレンス値です。 

スタック(stack)に格納されたシンプルなデータセグメントが保存されていること、すなわち、その値は変数アクセス位置に直接保存されています。リファレンス値はヒープ(heap)に格納されたオブジェクトであり、すなわち、変数の場所にはポインタ(point)が保存されており、オブジェクトを保存するメモリの場所を指しています。

 <script type="text"/javascript">
var box = new Object(); //参照型を生成します
var box = "lee";  //基本的な型の値は文字列です
box.age = 23;  //基本的な型の値に属性を追加することは奇妙です;因为只有 objects can add properties.
alert(box.age); //参照型ではありません;出力できません;
</script> 

3.JScriptの演算子 

優先順位:演算子の計算順序を指し、一般的にはどの部分を先に計算するかのことです。
結合性:同じ優先順位の演算子の計算順序、一般的には左から右か右から左かのことです。 

データ型の変換と基本的な包装型 

String() は文字列型に変換します
Number() は数字型に変換します
Boolean() は布尔型に変換します 

parseInt:文字列を整数に変換します。文字列の先頭から解析し、最初の非整数の場所で停止し、前に読み取ったすべての整数を返します。文字列が整数で始まっていない場合、NaNを返します。例えば:parseInt("150 hi”)が返す値は:150、parseInt(“hi”)が返す値は:NaNです。
 parseFloat:文字列を浮点数に変換します。文字列の先頭から解析し、最初の非整数の場所で停止し、前に読み取ったすべての整数を返します。文字列が整数で始まっていない場合、NaNを返します。例えば:parseFloat("15.5 hi") が返す値は:15.5、parseFloat("hi 15.5")が返す値は:NaNです。

 eval:文字列をJavaScriptの表現として計算し、実行結果を返します。結果がない場合はundefinedを返します。
基本的な包装型 

基本的な型の値を読み取るとき、バックグラウンドで対応する基本的な包装型のオブジェクトが作成され、これらのデータに対して操作を行うためのメソッドを呼び出すことができます。基本的な包装型にはBoolean、Number、Stringが含まれます。

 var box = 'trigkit4'; //リテラル
box.name = 'mike';  //無効な属性
box.age = function () { //無効なメソッド
  return 22;
};
//new演算子の書き方
var box = new String('trigkit4');//new演算子
box.name = 'mike';  //有効な属性
box.age = function () { //有効なメソッド
  return 22;
}; 

Stringタイプには3つの属性と多くの利用可能な内蔵メソッドが含まれています
 属性  説明
length : 文字列の文字数を返します
Constructor: Stringオブジェクトを生成する関数を返します
prototype: 文字列定義に属性やメソッドを追加するために使用

4.jsフローコントロール 

jsのフローコントロール文について、ここでは少し難しいものについてだけ説明します。他は省略します。次に、マインドマップを追加します。 

1.for…in 文は、オブジェクトの各属性やarrayの各要素に対して一つまたは複数のステートメントを実行します。
 for (variable in [object | array])
statements

引数: 
variable:必須。objectの任意の属性やarrayの任意の要素ができる変数。
 object, array:オプション。その上で巡回する必要があるオブジェクトやarray。
 statement:オプション。objectの各属性やarrayの各要素に対して実行される一つまたは複数のステートメント。複合ステートメントでも可。 

条件制御文(例えばif文)は、複数のステートメントを実行する場合にのみコードブロック(左括弧{で始まり、右括弧}で終わる)を使用する必要がありますが、ベストプラクティスは常にコードブロックを使用することです。

 if(args)
  alert(args);//間違えやすい
if(args){
  alert(args);//推奨使用
}

 5.js関数 

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

Jscript は、二種類の関数をサポートしています:一つは言語内の関数、もう一つは自分で作成した関数です。
JavaScript 関数は、引数を持ちないこともできます(ただし、引数を含む小括弧は省略できません),また関数に引数を渡して関数が使用できるようにすることができます。 

関数に関するより多くの情報は、私の別の記事「javascript学習大总结(四)function関数部分」を訪れてください。 

オブジェクトの構成
メソッド - 関数:プロセス、動的
属性 - 変数:状態、静的

最後に、先輩がまとめたマインドマップを追加します:

以上がこの記事の全てです。皆様の学習に役立つことを願っています。また、ナイアラベ教えてのサポートをどうぞ。

おすすめ