JavaScriptの基礎データを整理する

この記事は JavaScript の基本的なデータを整理するものです。必要な方は参考にしていただければ幸いです。

いくつかの情報を読んだ後、ES6、標高、MDN と組み合わせて、JS の中核となる知識ポイントを整理しました。紙面の都合上、ここでは重要と思われる知識のみ紹介します。いくつかの常識的なことについては標高を参照することができ、いくつかの核となる知識点の拡張については私の他の記事を参照することができます。この記事は、JS ナレッジ ポイントの復習や意外な使用に適しており、フロントエンドのインタビュー ガイドとしても使用できます。

7 つのデータ型

基本データ型: スタック メモリに格納され、値を操作します

null: null ポインター、つまり typeof null ==>Object

unknown: 未割り当ての値が定義されています。

Number: 数値

String: String

Symbol: インスタンスは、一意で不変のデータ型です。

ブール値: ブール値

参照データ型: ヒープ メモリに保存され、空間アドレスで動作します

オブジェクト: 具体的には、配列、関数、正規表現、日付などです

データ型の判定(方法、メリット、デメリット)

typeof: 基本型の非Nullのみ判定可能、参照データ型の判定は不可(全てオブジェクトのため)これは演算子

typeof ''  // ==> string
typeof 1  //==> number
typeof true  //==>boolean
typeof undefined  //==>undefined
let b = Symbol() ; typeof b //==>symbol
-----------------下面的判断不了实际类型了-----------------------
typeof function fn(){} //==>function
typeof null //==>object
typeof [1,2,3] //==>object
typeof {} //==>object

instanceof: コンストラクターのプロトタイプ属性がオブジェクトのプロトタイプ チェーンのどこかに現れるかどうかをテストするために使用されます。これを使用して配列を判断することはできますが、十分エレガントではありません。特定のリスクがあります

let arr = [1,2,3]
arr instanceof Array //==>true
arr instanceof Object //==>true

instanceof 演算子の問題は、Web ページに複数のフレームがある場合、実際には 2 つ以上の異なるグローバル実行環境が存在することです。配列コンストラクターのさまざまなバージョン。配列があるフレームから別のフレームに渡される場合、受信配列と 2 番目のフレームでネイティブに作成された配列は異なるコンストラクターを持ちます----高さ ページ 88 (著者による現地語訳: リスクは、プロトタイプ チェーン )

コンストラクター: 原理もプロトタイプ チェーンに基づいており、複数のフレーム間を往復する場合など、プロトタイプ チェーンの書き換えからもリスクが生じます。現時点では、これら 2 つの方法が最適です。各 iframe には独自の実行環境があるため、フレーム間でインスタンス化されたオブジェクトは相互にプロトタイプ チェーンを共有せず、そのため上記の検出コードが失敗します!

isNaN:このメソッドは最初に Number ## を呼び出します。 #、あまり役に立ちません

   console.log(isNaN("1px"));   //先调用Number('1px')，返回NaN，然后再调用isNaN(NaN)返回true
   //燃鹅 '1px'客观并不是NaN

rree----------------------------- -- -----------より良い方法---------------------------------

Object.prototype.toString.call()

    [1,2,3,1].constructor === Array; // true

---------------------------- ---- ----------------エレガントな方法---------------------

判断する必要がある場合個別に配列

    Object.prototype.toString.call(null) // ==> [object Null]
    Object.prototype.toString.call([]) // ==> [object Array]

nullを個別に判定する必要がある場合

Array.isArray([]) //==>true

変数を宣言する6つの方法

ES5では、変数を宣言する方法は var コマンドと function コマンドの 2 つだけです。 let および const コマンドの追加に加えて、ES6 では後の章で変数を宣言する 2 つの方法、import コマンドと class コマンドについても説明します。したがって、ES6 には変数を宣言する方法が合計 6 つあります。 --es6

var: 変数のプロモーション、ブロックレベルのスコープなし

var に関しては、変数のプロモーションについて言及する必要があります。現在のスコープ、js (関数) が実行される前、ブラウザが持ってきます var や関数は事前に宣言・定義しておきます

1. 変数は宣言のみ、関数は宣言・代入、自己実行関数の定義と実行は一緒に完了します

# 論理判定条件の影響を受けない

2. #return 以下も昇格するが、return は昇格しない

3. ステートメントの重複は問題なく、再代入は Yes ですが、変数名とメソッド名が競合することはできません

4. const: 定数、アドレスは変更されませんが、属性は変更できます

let: ブロック スコープ、一時デッド ゾーン (TDZ)、変数プロモーションなし、繰り返し宣言は許可されません

let a = null
Object.is(a , null) //==>true

import:es6 モジュラー ソリューション

class:es6 継承ソリューション

型変換

このセクションは内容が多すぎて複雑すぎます。実際、このようなコードを書ける人はほとんどいないので、あまり書きたくないのです。しかし、これは非常に重要なので、面接でテストする必要があります。全員がこの領域の核となる内容と原則をマスターし、奇妙なトリックに注意を払わないことをお勧めします。

1. 自動パッケージ化

3 つのパッケージ化タイプ: Number、Boolean、String

//只要块级作用域内存在let命令，它所声明的变量就“绑定”（binding）这个区域，不再受外部的影响。所以下面代码不报错，外层作用域和里层作用域都有一个tmp
let tmp = 123;
    if (true) {
      let tmp =123;    
    }
//ES6 明确规定，如果区块中存在let和const命令，这个区块对这些命令声明的变量，从一开始就形成了封闭作用域。凡是在声明之前就使用这些变量，就会报错。
    let tmp = 123;
    if (true) {
      tmp = 'abc'; // ReferenceError
      let tmp;    
    }

これらのタイプ (コンストラクター) は基本的に tostring メソッドを書き換えます

2. 数値への強制変換

##数値: 他のデータ型の値を数値型に強制します。

#

let s1 = '123'
let s2 = s1.slice(2)         // a是基本类型，它是没有slice方法的这里实际上后台完成了一个自动装包
---下面是实际发生的事---------
let s1 = new string('123')
let s2 = s1.slice(2)     
s1 = null      //注意这里用完就销毁了

//所以如果添加某个属性后面是调用不出来的
let s1 = '123'
s1.color = 'red'
console.log(s1.color) // ==> undefind

parseInt: 文字列から数値を抽出するためによく使用されるメソッド。無効な数値が見つかるまで文字列を左から右に識別し、停止して、見つかった数値を返します。

    console.log(Number({}));//NaN
    console.log(Number(null));// 0
    console.log(Number(undefined));// NaN
    console.log(Number([]));// 0
    console.log(Number(""));// 0
    console.log(Number(true));// 1
    console.log(Number(false));

toFixed: 小数点の数を保持するメソッド、
• 戻り値は文字列です

  ;

  console.log(parseInt("12px12"));// 12
  console.log(parseInt("12.666.777px12"));// 12
  console.log(parseInt("px12.666px12"));// NaN
  console.log(parseInt(""));// NaN
  console.log(parseInt(true));// NaN
  console.log(parseInt({}));// NaN
  console.log(parseInt([]));// NaN
  console.log(parseInt(null));// NaN
  console.log(parseInt(undefined));// NaN

3.- Conversion

• は、まず文字列を数値 (Number) に変換してから、計算を実行します。

  NaN、undiffed を含む計算は、Is it NaN
# となることに注意してください。 ##

    console.log(Number("1px"));   //==> NAN
    console.log(parseInt("1px"));   //==> 1
    console.log(parseInt("p1px"));   //==> NaN

4. 変換

特定の通話文字列または番号については、以下の表を参照してください

            || undefined | null   | boolean | number | string | object |
=========================================================================
 undefined  || number    | number | number  | number | string | string | 
 null       || number    | number | number  | number | string | string | 
 boolean    || number    | number | number  | number | string | string | 
 number     || number    | number | number  | number | string | string | 
 string     || string    | string | string  | string | string | string | 
 object     || string    | string | string  | string | string | string |

    //字符串和任何类型相加都是调用String
    var  a = typeof 10 + true + [] + null + undefined+{};
    console.log(a); //==>numbertruenullundefined[object Object]，{}
    console.log("6px"+undefined); ==> 6pxundefined
    console.log(NaN+"undefined");==> NaNundefined
    //经典面试题
    [1,2]+[2,1]  //==>都调用toString '1,2'+'2,1'===>'1,22,1'

5.布尔值Boolean

其他数据类型转布尔类型是false有且只有五个值： 0  ""  NaN null  undefined  
所以boolean({}) 或者boolean([]) 都是真

6.==和===

===是全等，==是类型转化后再判断，规则比较复杂。这里我认为除了准备面试需要看看，平时基本不会用，所以这个知识性价比非常低，学了用不到也会忘，大家自己把握，详细规则可以搜我其他文章
平时除了判断a是否是undefined或者是null(jq源码里面都用法)都时候其他情况下都用===

console.log(null==undefined) // true
console.log(undefined==undefined) // true

以上がJavaScriptの基礎データを整理するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。