1

Layout Component - Assets, Metadata, and CSS | Learn Next.js

に下記の記載があります。

export default function Layout({ children }) {
  return <div>{children}</div>
}

引数部の { children }の意味はなんでしょうか?
JavaScriptってこんなところに{}は許されたでしょうか?
Next.js特有の文法なのか、babelかなにかの特殊な文法でしょうか?

1 件の回答 1

3

分割代入(Destructuring assignment) という 構文 (代入演算子)で, それを利用したものです

// オブジェクトのプロパティーと同じ名前の変数で受け取る
function fn({id}) {
  console.log(id); // 123
}
fn({id: 123})

const o = {p: 42, q: true}
// オブジェクトのプロパティーとは異なる名前を持つ変数で受け取る
function fn2({p: foo, q: bar}) {
  console.log(foo); // 42
  console.log(bar); // true
}
fn2(o)

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。