translate 1-data-types into japanese

4 years ago · 7cf251b3cb
parent e673998d7e
commit 7cf251b3cb
2 changed files with 210 additions and 0 deletions
--- a/2-js-basics/1-data-types/translations/README.ja.md
+++ b/2-js-basics/1-data-types/translations/README.ja.md
@ -0,0 +1,196 @@
+# JavaScript の基本: データ型
+
+![JavaScript Basics - Data types](images/webdev101-js-datatypes.png)
+> Sketchnote by [Tomomi Imura](https://twitter.com/girlie_mac)
+
+## レクチャー前クイズ
+[レクチャー前クイズ](.github/pre-lecture-quiz.md)
+
+このレッスンでは、Web 上でインタラクティブな機能を提供する言語である JavaScript の基礎を学びます。
+
+[![Data types in JavaScript](https://img.youtube.com/vi/JNIXfGiDWM8/0.jpg)](https://youtube.com/watch?v=JNIXfGiDWM8 "Data types in JavaScript")
+
+
+まず、変数とそれを埋めるデータ型について説明しましょう!
+
+## 変数
+
+変数には、コード全体で使用したり変更したりできる値が格納されています。
+
+変数の作成と **宣言** には、次のような構文 **[キーワード] [名前]** があります。の2つの部分で構成されています。
+
+- **キーワード**。キーワードは `let` または `var` です。
+
+   > 注: `let` というキーワードは ES6 で導入されたもので、変数に _ブロックスコープ_ と呼ばれるものを与えます。`var` よりも `let` を使うことをお勧めします。ブロックスコープについては、今後のパートで詳しく説明します。
+- **変数名**、これは自分で選んだ名前です。
+
+### タスク - 変数を使って作業する
+
+1. **変数の宣言**. `let` キーワードを使って変数を宣言してみましょう。
+
+    ```javascript
+    let myVariable;
+    ```
+
+   `myVariable` は `let` キーワードを使用して宣言されました。これは現在のところ値を持っていません。
+
+1. **値を代入します**。値を `=` 演算子で変数に格納し、その後に期待される値を指定します。
+
+    ```javascript
+    myVariable = 123;
+    ```
+
+   > 注: このレッスンで `=` を使うということは、変数に値を設定するために使われる「代入演算子」を使うことを意味します。これは平等を示すものではありません。
+
+   `myVariable` は値 123 で *初期化* されました。
+
+1. **リファクタ**。コードを以下の文に置き換えてください。
+
+    ```javascript
+    let myVariable = 123;
+    ```
+
+    上記のように変数が宣言され、同時に値が代入されることを _明示的初期化_ といいます。
+
+1. **変数の値を変更します**。以下の方法で変数値を変更します。
+
+   ```javascript
+   myVariable = 321;
+   ```
+
+   一度変数が宣言されると、`=` 演算子と新しい値を使って、コードのどの時点でもその値を変更することができます。
+
+   ✅ お試しください ブラウザで JavaScript を書くことができます。ブラウザのウィンドウを開き、開発者ツールに移動します。コンソールにプロンプトが表示されるので、`let myVariable = 123` と入力して return を押し、`myVariable` と入力します。どうなりますか？これらの概念については、後のレッスンで詳しく説明します。
+
+## 定数
+
+定数の宣言と初期化は、`const` キーワードを除いて、変数と同じ概念に従います。定数は通常、すべて大文字で宣言されます。
+
+```javascript
+const MY_VARIABLE = 123;
+```
+
+定数は変数と似ていますが、2つの例外があります。
+
+- **値を持つ必要があります**。定数を初期化しておかないと、コード実行時にエラーが発生します。
+- **参照は変更できません**。定数の参照は、一度初期化すると変更できません。そうしないと、コードを実行するときにエラーが発生します。2つの例を見てみましょう。
+   - **単純な値**です。以下は許可されていません。
+   
+      ```javascript
+      const PI = 3;
+      PI = 4; // 不許可
+      ```
+ 
+   - **オブジェクト参照は保護されています**。以下は許可されていません。
+   
+      ```javascript
+      const obj = { a: 3 };
+      obj = { b: 5 } // 不許可
+      ```
+
+    - **オブジェクトの値は保護されていません**。以下は許可されています。
+    
+      ```javascript
+      const obj = { a: 3 };
+      obj.a = 5;  // 許可
+      ```
+
+      上記ではオブジェクトの値を変更していますが、参照自体は変更できません。
+
+   > 注: `const` は参照が再割り当てから保護されていることを意味します。しかし、値は _不変_ ではなく、特にオブジェクトのような複雑な構造体であれば、変更される可能性があります。
+
+## データ型
+
+変数は、数値やテキストなど、多くの異なるタイプの値を格納することができます。これらのさまざまなタイプの値は、**データ型**として知られています。データ型は、開発者がコードをどのように書くべきか、ソフトウェアをどのように実行するべきかを決定するのに役立つため、ソフトウェア開発において重要な役割を果たします。さらに、データ型の中には、値の中の付加的な情報を変換したり抽出したりするのに役立つ独自の機能を持つものもあります。
+
+✅ データ型は、言語によって提供される最低レベルのデータ型であるため、JavaScript のデータプリミティブとも呼ばれています。プリミティブデータ型には、string、number、bigint、boolean、undefined、symbol の6つのデータ型があります。これらのプリミティブのそれぞれが何を表しているかを可視化してみましょう。`zebra` は何でしょうか？ `0` はどうでしょうか？ `true` はどうでしょうか?
+
+### 数値
+
+前のセクションでは、`myVariable` の値は数値データ型でした。
+
+`let myVariable = 123;`
+
+変数は、小数や負の数を含むあらゆるタイプの数値を格納することができます。数値は、[次のセクション](#operators)で説明する算術演算子と一緒に使用することもできます。
+
+### 算術演算子
+
+算術関数を実行する際に使用する演算子にはいくつかの種類があり、ここではいくつかを紹介します。
+
+| シンボル | 説明                                                              | 例                          |
+| ------ | ------------------------------------------------------------------------ | -------------------------------- |
+| `+`    | **加算**: 2つの数値の和を計算します。                | `1 + 2 //期待される答えは 3 です。`   |
+| `-`    | **減算**: 2つの数値の差を計算します。                | `1 - 2 //期待される答えは -1 です。`  |
+| `*`    | **乗算**: 2つの数値の積を計算します。                | `1 * 2 //期待される答えは 2 です。`   |
+| `/`    | **除算**: 2つの数値の商を計算します。                | `1 / 2 //期待される答えは 0.5 です。` |
+| `%`    | **余り**: 2つの数値の割り算から余りを計算します | `1 % 2 //期待される答えは 1 です。`   |
+
+✅ 試してみましょう! ブラウザのコンソールで算術を試してみてください。驚きの結果が出ましたか？
+
+### 文字列
+
+文字列は、一重引用符または二重引用符の間に存在する文字の集合です。
+
+- `'This is a string'`
+- `"This is also a string"`
+- `let myString = 'This is a string value stored in a variable';`
+
+文字列を書くときには引用符を使うことを忘れないでください。そうしないと、JavaScript はそれを変数名とみなします。
+
+### 文字列のフォーマット
+
+文字列はテキストであり、時々フォーマットが必要になります。
+
+2 つ以上の文字列を **連結** したり、結合したりするには、`+` 演算子を使用します。
+
+```javascript
+let myString1 = "Hello";
+let myString2 = "World";
+
+myString1 + myString2 + "!"; //HelloWorld!
+myString1 + " " + myString2 + "!"; //Hello World!
+myString1 + ", " + myString2 + "!"; //Hello, World!
+
+```
+
+✅ JavaScript では `1 + 1 = 2` なのに、`'1' + '1' = 11` なのはなぜでしょうか? `'1' + 1` はどうでしょうか？
+
+**テンプレートリテラル** は文字列をフォーマットするもう一つの方法ですが、引用符の代わりにバックスティックを使用します。プレーンテキストではないものはすべてプレースホルダー `${ }` の中に入れなければなりません。これには、文字列である可能性のある変数も含まれます。
+
+```javascript
+let myString1 = "Hello";
+let myString2 = "World";
+
+`${myString1} ${myString2}!` //Hello World!
+`${myString1}, ${myString2}!` //Hello, World!
+```
+
+どちらの方法でも書式設定の目標を達成することができますが、テンプレートリテラルはスペースや改行を尊重します。
+
+✅ テンプレートリテラルとプレーンな文字列を使用するのはいつですか？
+
+### ブール値
+
+ブール値は2つの値だけを持つことができます。`true` か `false` です。ブール値は、特定の条件が満たされたときにどの行のコードを実行するかを決定するのに役立ちます。多くの場合、[演算子](#operators) がブール値の設定を支援し、変数が初期化されたり、演算子で値が更新されたりしていることに気付いたり、書いたりすることが多いでしょう。
+
+- `let myTrueBool = true`
+- `let myFalseBool = false`
+
+✅ 変数の評価値がブール値 `true` であれば、変数は 'truthy' とみなされます。興味深いことに、JavaScript では、[falsy として定義されていない限り、すべての値は truthy です](https://developer.mozilla.org/ja/docs/Glossary/Truthy)。
+
+---
+
+## 🚀 チャレンジ
+
+JavaScript は、たまにデータ型を扱う際の意外な方法で悪名高いです。これらの 'gotchas' について少し調べてみてください。例えば: 大文字小文字の区別でつまずくことがあります! コンソールで以下のようにしてみてください。`let age = 1; let Age = 2; age == Age` (解決は `false` -- なぜ?) 他にどのような gotchas があるでしょうか?
+
+## レクチャー後クイズ
+[レクチャー後クイズ](.github/post-lecture-quiz.md)
+
+## 復習と自己学習
+
+この [JavaScript の練習問題リスト](https://css-tricks.com/snippets/javascript/)を見て、1つ試してみてください。何を学びましたか？
+
+## 課題
+
+[データ型の練習](assignment.md)
--- a/2-js-basics/translations/README.ja.md
+++ b/2-js-basics/translations/README.ja.md
@ -0,0 +1,14 @@
+# JavaScript 入門
+
+JavaScript は Web の言語です。この4つのレッスンでは、その基本を学びます。
+
+### トピック
+
+1. [変数とデータ型](1-data-types/README.md)
+2. [関数とメソッド](2-functions-methods/README.md)
+3. [JavaScript での意思決定](3-making-decisions/README.md)
+4. [配列とループ](4-arrays-loops/README.md)
+
+### Credits
+
+These lessons were written with ♥️ by [Jasmine Greenaway](https://twitter.com/paladique), [Christopher Harrison](https://twitter.com/geektrainer) and [Chris Noring](https://twitter.com/chris_noring)