Why not login to Qiita and try out its useful features?

We'll deliver articles that match you.

You can read useful information later.

0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

[JavaScript] 分割代入

Last updated at Posted at 2024-11-07

環境

MacBook Pro (2.3 GHz 8コアIntel Core i9)
macOS 14.0(23A344)
Homebrew 4.3.8
gh 2.52.0

まとめ

分割代入を行うことで下記のようなメリットが得られる

  • JavaScriptの分割代入はプロパティを取り出せる
  • 同じ変数名を使う場合、コードが簡潔になる
  • 複数のプロパティを取り出すときは特に便利

目次

オブジェクト

分割代入_不使用

const myProfile = {
    namee: "Jochun",
    age: "25"
};

const message1 = `名前は${myProfile.name}です、年齢は${myProfile.age}歳です。`;
console.log(message1);

// 出力結果
// 名前はJochunです、年齢は25歳です。

分割代入_使用

const myProfile = {
    namee: "Jochun",
    age: "25"
};

const { name, age } = myProfile;
const message2 = `名前は${name}です、年齢は${age}歳です。`;
console.log(message2);

// 出力結果
// 名前はJochunです、年齢は25歳です。

配列

分割代入_不使用

const myProfile = ["Jochun", 25];

const message3 = `名前は${myProfile[0]}です、年齢は${myProfile[1]}歳です。`;
console.log(message3);

// 出力結果
// 名前はJochunです、年齢は25歳です。

分割代入_使用

const myProfile = ["Jochun", 25];

const [ name, age ] = myProfile;
const message4 = `名前は${name}です、年齢は${age}歳です。`;
console.log(message4);

// 出力結果
// 名前はJochunです、年齢は25歳です。

注意点:配列のプロパティははっきりしていないが、下記のnameageのように変数を決める必要がある。

参考リンク

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up

@Jochun's pickup articles

Linked from these articles

Comments

No comments

Let's comment your feelings that are more than good

Qiita Conference 2024 Autumn will be held!: 11/14(Thu) - 11/15(Fri)

Qiita Conference is the largest tech conference in Qiita!

Keynote Speaker

Takahiro Anno, Masaki Fujimoto, Yukihiro Matsumoto(Matz), Shusaku Uesugi / Nicolas Ishihara(Vercel Inc.)

View event details

Being held Article posting campaign

0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Login to continue?

Login or Sign up with social account

Login or Sign up with your email address