Javascript 構造化代入の詳細

Javascript 構造化代入の詳細

1. 配列の分解

[a, b, c] = [1,2,3]とする
コンソール.log(a, b, c) // 1 2 3


配列に加えて、文字列などの反復可能なオブジェクトも構造化分解できる。

[最初、2番目] = "彼"とする

console.log(first, second) // 彼

2. オブジェクトの分解

代入の右側はオブジェクトで、左側は中括弧で囲まれたカンマで区切られた変数名です。

{a, b, c} = {a:1, b:2, c:3} とします。
コンソール.log(a,b,c) // 1 2 3


左側の変数名は、オブジェクト内のプロパティ名と同じである必要があります。一致しない場合は、左側の変数名にundefinedが割り当てられます。例えば:

{a,b,d} = {a:1,b:2,c:3}とします。
console.log(a,b,d) // 1 2 未定義


変数名が属性名と異なる場合は、コロン区切りを使用して変数名に属性名を割り当てることができます。

例えば:

{a,b,c:d} = {a:1,b:2,c:3}とします。
コンソール.log(a,b,d) // 1 2 3


3. 不完全な解体

分割代入の左側の変数の数は、右側の配列の要素の数と一致しない場合があります。

(1)左側の余分な変数は未定義に設定されます。

[a, b, c] = [1, 2]とする

console.log(a, b, c) // 1 2 未定義

(2)右側の余分な値は直接無視される

[a, b, c] = [1, 2, 3, 4]とする

コンソール.log(a, b, c) // 1 2 3


(3)左側にカンマを入れると、特定の値をスキップできる。

[a, , c] = [1, 2, 3, 4]とする

コンソールログ(a, c) // 1 3


(4)右側の余分な値は次のようにして変数に集めることができる。

[a, b, ...c] = [1, 2, 3, 4]とします。

コンソール.log(a, b, c) // 1 2 [3, 4]


4. 分割代入を使用して変数交換を実装する

a = 1、b = 2 とします。
[a, b] = [b, a]
コンソールログ(a) //2
コンソールログ(b) //1

Javascript分解課題の詳細に関するこの記事はこれで終わりです。より関連性の高いJavascript分解課題の内容については、123WORDPRESS.COM の過去の記事を検索するか、以下の関連記事を引き続き閲覧してください。今後とも 123WORDPRESS.COM を応援していただければ幸いです。

以下もご興味があるかもしれません:
  • JS 構造化分解の 5 つの興味深い使い方
  • ES6 バージョンの JavaScript で分割代入を解析する
  • JavaScript の構造化代入を理解するのに役立つ記事
  • JavaScript オブジェクト分割の使用例の分析
  • JavaScript 構造化分解割り当ての実践ガイド
  • JavaScript 構造化代入の詳細な説明
  • JavaScript ES6 分割演算子の理解と応用
  • ES6 における JavaScript 分割代入の一般的な使用法の概要

<<:  CSS3は、欠けた角の長方形、折り畳まれた角の長方形、欠けた角の境界線を実装しています。

>>:  HTMLファイル内の中国語の文字化けとブラウザでの表示の問題

推薦する

Docker Nginxコンテナの制作と展開の実装方法

クイックスタート1. Docker Hubでnginxイメージを見つけるdocker 検索 ngin...

CentOS 7.x のマスターおよびスレーブ DNS サーバーの展開

1. 準備例: 2 台のマシン: 192.168.219.146 (マスター)、192.168.21...

MySQLはデータテーブル内の既存のテーブルを分割します

目次操作方法操作プロセス既存のテーブルにパーティション テーブルを作成し、データを新しいテーブルに移...

RR および RC 分離レベルでのインデックスとロックのテスト スクリプトのサンプル コード

基本概念現在の読み取りとスナップショットの読み取りMVCC では、読み取り操作はスナップショット読み...

CSSでカスタムフォント(font-face)を導入する方法の詳細な説明

なぜこれを使ったのか?それはポスターを作ることから始まりました。それは嵐の夜でした。 。 。さて、無...

CentOS7.4 に MySQL 5.7.26 をインストールするための詳細なチュートリアル

CentOS にはデフォルトで MariaDB がインストールされていますが、これは MySQL の...

MySQLストアドプロシージャを変更する詳細な手順

序文実際の開発では、ビジネス要件が変更されることが多いため、ストアド プロシージャの特性を変更するこ...

MySQLフィールドのデフォルト値を設定する方法

目次序文: 1. デフォルト値に関する操作2. 使用上の提案要約:序文: MySQL では、テーブル...

Dockerのインストール方法とDockerの4つのネットワークモードの詳細説明

1. Dockerをインストールするyum -y install docker-ioインストールが完...

MYSQLでプロシージャの名前を変更する方法の詳細な説明

最近、ストアド プロシージャの名前を変更する機能を使用しました。インターネットで情報を検索しましたが...

HTMLメタの大きな役割

メタ属性には、name と http-equiv の 2 つがあります。 name 属性は主に、We...

CentOS で RPM を使用して MySQL 5.6 をインストールするチュートリアル

これまでのプロジェクトはすべて Windows システム環境にデプロイされていました。今回は Lin...

フロントエンド開発における一般的なテクニックのまとめ

1. 記事タイトルリストの右側に日付を表​​示する方法:コードをコピーコードは次のとおりです。 &l...

VMware 15 仮想マシンに Ubuntu 18.04 をインストールするグラフィック チュートリアル

ここ数年、私は自動化とコンピューターを行ったり来たりしてきました。最近は、機械学習に関連するプロジェ...