# General Translation React SDKs (gt-react, gt-next): declareVar
URL: https://generaltranslation.com/ja/docs/react/reference/functions/declare-var.mdx
---

title: declareVar
description: General Translation gt-react で、derived content 内の翻訳対象外の変数を指定します。declareVar の API リファレンス。

---

`declareVar` 関数は、[`derive`](/docs/react/reference/functions/derive) コンテンツ内の動的コンテンツのうち、翻訳から除外し、実行時で変数として扱うものを指定します。これは [`<Var>`](/docs/react/reference/components/var) コンポーネントの文字列版に相当します。

*`gt-react`、`gt-next`、`gt-tanstack-start`、`gt-react-native` で利用できます。例では `gt-react` からインポートしていますが、実際にはお使いのフレームワークのパッケージからインポートしてください。*

## 概要 [#overview]

動的な値は、`derive` が解析する関数内でラップします。`declareVar` はその値を ICU 互換のプレースホルダーで包み、実行時に元の値へと解決されます。

```tsx
function getGreeting(name) {
  return 'Hello, ' + declareVar(name);
  // "こんにちは、{_gt_, select, other {Brian}}"
}

gt(`${derive(getGreeting(name))}. How are you?`);
// "こんにちは、Brian。お元気ですか？"
```

*注: `declareVar` は、[`derive`](/docs/react/reference/functions/derive) から呼び出される関数内でのみ使用してください。string を処理するために ICU マーカーを削除するには、[`decodeVars`](/docs/react/reference/functions/decode-vars) を使用してください。*

## 仕組み [#how-it-works]

`declareVar` が値をラップすると、次の処理が行われます。

1. 値を ICU の `select` 文形式に変換します。
2. 翻訳処理の対象となる動的コンテンツとしてマークします。
3. 翻訳用のハッシュ計算から除外します。
4. 実行時での補間に使えるよう、元の値を保持します。

出力は、ICU MessageFormat と互換性のある文字列です。

```tsx
declareVar('John'); // → "{_gt_, select, other {John}}"
```

## パラメータ [#parameters]

| パラメータ                   | 説明                  | 型                                                  | 任意  | デフォルト |
| ----------------------- | ------------------- | -------------------------------------------------- | --- | ----- |
| [`variable`](#variable) | 変数としてマークする動的な値です。   | `string \| number \| boolean \| null \| undefined` | いいえ | —     |
| [`options`](#options)   | `$name` などのオプションです。 | `object`                                           | はい  | —     |

### `variable` [#variable]

**Type** `string | number | boolean | null | undefined` · **必須**

変数として扱う動的な値です。

### `options` [#options]

**Type** `object` · **任意**

変数に関するオプションです。`options.$name` (`string`) は、[`<Var>`](/docs/react/reference/components/var) の `name` prop と同様に、翻訳コンテキスト用の変数名を指定します。

## 戻り値 [#returns]

**型** `string`

元の値を保持し、実行時に正しく復元できるようにするICU互換マーカーを含む文字列。

## 例 [#examples]

```tsx title="BasicUsage.tsx"
import { derive, declareVar, gt } from 'gt-react';

function getGreeting(name) {
  return `Hello, ${declareVar(name)}!`;
}

function Component() {
  const name = 'Brian';
  const message = gt(`${derive(getGreeting(name))} Welcome back.`);
  return <p>{message}</p>;
}
```

```tsx title="WithOtherFunctions.tsx"
import { declareVar, derive, useGT } from 'gt-react';

function Component({ name1, name2 }) {
  const gt = useGT();
  const message = gt('Hello, {name1}! My name is ' + derive(declareVar(name2)), { name1 });
  return <p>{message}</p>;
  // "Hello, Brian! My name is Archie"
}
```

## メモ [#notes]

* `declareVar` は、[`derive`](/docs/react/reference/functions/derive) から呼び出される関数内でのみ使用してください。
* 文字列処理に干渉する可能性のある ICU マーカーが追加されます。必要に応じて、[`decodeVars`](/docs/react/reference/functions/decode-vars) を使って元の値を取り出してください。
* 変数は翻訳対象から除外され、実行時でも保持されます。
* JSX 形式については、[`<Var>`](/docs/react/reference/components/var) コンポーネントを参照してください。