Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ja: Format /learn/javascript using Prettier #14557

Merged
merged 3 commits into from
Jul 28, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion .prettierignore
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,6 @@ build/
/files/fr/web/javascript/**/*.md

# ja
/files/ja/learn/javascript/**/*.md
/files/ja/mozilla/**/*.md
/files/ja/mdn/**/*.md
/files/ja/mozilla/add-ons/**/*.md
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -48,16 +48,16 @@ div {
```

```js
const output = document.querySelector('#output');
const button = document.querySelector('#set-alarm');
const output = document.querySelector("#output");
const button = document.querySelector("#set-alarm");

function setAlarm() {
setTimeout(() => {
output.textContent = '起きて!';
output.textContent = "起きて!";
}, 1000);
}

button.addEventListener('click', setAlarm);
button.addEventListener("click", setAlarm);
```

{{EmbedLiveSample("Wrapping setTimeout()", 600, 100)}}
Expand All @@ -76,7 +76,7 @@ button.addEventListener('click', setAlarm);
function alarm(person, delay) {
return new Promise((resolve, reject) => {
if (delay < 0) {
throw new Error('アラームの待ち時間を負数にすることはできません。');
throw new Error("アラームの待ち時間を負数にすることはできません。");
}
setTimeout(() => {
resolve(`${person}、起きて!`);
Expand Down Expand Up @@ -122,26 +122,28 @@ button {
```

```js
const name = document.querySelector('#name');
const delay = document.querySelector('#delay');
const button = document.querySelector('#set-alarm');
const output = document.querySelector('#output');
const name = document.querySelector("#name");
const delay = document.querySelector("#delay");
const button = document.querySelector("#set-alarm");
const output = document.querySelector("#output");

function alarm(person, delay) {
return new Promise((resolve, reject) => {
if (delay < 0) {
throw new Error('アラームの待ち時間を負数にすることはできません。');
throw new Error("アラームの待ち時間を負数にすることはできません。");
}
setTimeout(() => {
resolve(`${person}、起きて!`);
}, delay);
});
}

button.addEventListener('click', () => {
button.addEventListener("click", () => {
alarm(name.value, delay.value)
.then((message) => output.textContent = message)
.catch((error) => output.textContent = `アラームを設定できません: ${error}`);
.then((message) => (output.textContent = message))
.catch(
(error) => (output.textContent = `アラームを設定できません: ${error}`),
);
});
```

Expand Down Expand Up @@ -180,28 +182,27 @@ button {
```

```js
const name = document.querySelector('#name');
const delay = document.querySelector('#delay');
const button = document.querySelector('#set-alarm');
const output = document.querySelector('#output');
const name = document.querySelector("#name");
const delay = document.querySelector("#delay");
const button = document.querySelector("#set-alarm");
const output = document.querySelector("#output");

function alarm(person, delay) {
return new Promise((resolve, reject) => {
if (delay < 0) {
throw new Error('アラームの待ち時間を負数にすることはできません。');
throw new Error("アラームの待ち時間を負数にすることはできません。");
}
setTimeout(() => {
resolve(`${person}、起きて!`);
}, delay);
});
}

button.addEventListener('click', async () => {
button.addEventListener("click", async () => {
try {
const message = await alarm(name.value, delay.value);
output.textContent = message;
}
catch (error) {
} catch (error) {
output.textContent = `アラームを設定できません: ${error}`;
}
});
Expand Down
40 changes: 22 additions & 18 deletions files/ja/learn/javascript/asynchronous/introducing/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ l10n:
以下のようなコードを考えてみましょう。

```js
const name = 'Miriam';
const name = "Miriam";
const greeting = `Hello, my name is ${name}!`;
console.log(greeting);
// "Hello, my name is Miriam!"
Expand All @@ -64,7 +64,7 @@ function makeGreeting(name) {
return `Hello, my name is ${name}!`;
}

const name = 'Miriam';
const name = "Miriam";
const greeting = makeGreeting(name);
console.log(greeting);
// "Hello, my name is Miriam!"
Expand Down Expand Up @@ -113,15 +113,15 @@ function generatePrimes(quota) {
return primes;
}

const quota = document.querySelector('#quota');
const output = document.querySelector('#output');
const quota = document.querySelector("#quota");
const output = document.querySelector("#output");

document.querySelector('#generate').addEventListener('click', () => {
document.querySelector("#generate").addEventListener("click", () => {
const primes = generatePrimes(quota.value);
output.textContent = `${quota.value} 個の素数を生成しました。`;
});

document.querySelector('#reload').addEventListener('click', () => {
document.querySelector("#reload").addEventListener("click", () => {
document.location.reload();
});
```
Expand Down Expand Up @@ -182,15 +182,15 @@ function generatePrimes(quota) {
return primes;
}

const quota = document.querySelector('#quota');
const output = document.querySelector('#output');
const quota = document.querySelector("#quota");
const output = document.querySelector("#output");

document.querySelector('#generate').addEventListener('click', () => {
document.querySelector("#generate").addEventListener("click", () => {
const primes = generatePrimes(quota.value);
output.textContent = `${quota.value} 個の素数を生成しました。`;
});

document.querySelector('#reload').addEventListener('click', () => {
document.querySelector("#reload").addEventListener("click", () => {
document.location.reload();
});
```
Expand Down Expand Up @@ -230,23 +230,27 @@ pre {
```

```js
const log = document.querySelector('.event-log');
const log = document.querySelector(".event-log");

document.querySelector('#xhr').addEventListener('click', () => {
log.textContent = '';
document.querySelector("#xhr").addEventListener("click", () => {
log.textContent = "";

const xhr = new XMLHttpRequest();

xhr.addEventListener('loadend', () => {
xhr.addEventListener("loadend", () => {
log.textContent = `${log.textContent}ステータス ${xhr.status} で完了しました`;
});

xhr.open('GET', 'https://raw.githubusercontent.com/mdn/content/main/files/en-us/_wikihistory.json');
xhr.open(
"GET",
"https://raw.githubusercontent.com/mdn/content/main/files/en-us/_wikihistory.json",
);
xhr.send();
log.textContent = `${log.textContent}XHR リクエストを開始しました\n`;});
log.textContent = `${log.textContent}XHR リクエストを開始しました\n`;
});

document.querySelector('#reload').addEventListener('click', () => {
log.textContent = '';
document.querySelector("#reload").addEventListener("click", () => {
log.textContent = "";
document.location.reload();
});
```
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -50,12 +50,11 @@ l10n:

```js
function generatePrimes(quota) {

function isPrime(n) {
for (let c = 2; c <= Math.sqrt(n); ++c) {
if (n % c === 0) {
return false;
}
return false;
}
}
return true;
}
Expand All @@ -73,14 +72,17 @@ function generatePrimes(quota) {
return primes;
}

document.querySelector('#generate').addEventListener('click', () => {
const quota = document.querySelector('#quota').value;
document.querySelector("#generate").addEventListener("click", () => {
const quota = document.querySelector("#quota").value;
const primes = generatePrimes(quota);
document.querySelector('#output').textContent = `Finished generating ${quota} primes!`;
document.querySelector(
"#output",
).textContent = `Finished generating ${quota} primes!`;
});

document.querySelector('#reload').addEventListener('click', () => {
document.querySelector('#user-input').value = 'Try typing in here immediately after pressing "Generate primes"';
document.querySelector("#reload").addEventListener("click", () => {
document.querySelector("#user-input").value =
'Try typing in here immediately after pressing "Generate primes"';
document.location.reload();
});
```
Expand All @@ -99,7 +101,7 @@ document.querySelector('#reload').addEventListener('click', () => {
"index.html" ファイルと "style.css" ファイルは、すでに完成しています。

```html
<!DOCTYPE html>
<!doctype html>
<html lang="ja">
<head>
<meta charset="utf-8" />
Expand All @@ -118,7 +120,8 @@ document.querySelector('#reload').addEventListener('click', () => {

<textarea id="user-input" rows="5" cols="62">
[素数の生成]を押した後、すぐにここに入力してみてください。
</textarea>
</textarea
>

<div id="output"></div>
</body>
Expand All @@ -140,28 +143,31 @@ textarea {

```js
// 新しいワーカーを作成し、"generate.js" にあるコードを与えます。
const worker = new Worker('./generate.js');
const worker = new Worker("./generate.js");

// ユーザーが[素数の生成]をクリックしたら、ワーカーにメッセージを送ります。
// メッセージのコマンドは "generate" であり、メッセージには生成する素数の
// 数である "quota" も含まれています。
document.querySelector('#generate').addEventListener('click', () => {
const quota = document.querySelector('#quota').value;
document.querySelector("#generate").addEventListener("click", () => {
const quota = document.querySelector("#quota").value;
worker.postMessage({
command: 'generate',
command: "generate",
quota,
});
});

// ワーカーがメインスレッドにメッセージを送り返したら、メッセージ
// データから受け取った生成された素数の個数を含むユーザーへの
// メッセージで出力ボックスを更新します。
worker.addEventListener('message', (message) => {
document.querySelector('#output').textContent = `${message.data} 個の素数を生成しました。`;
worker.addEventListener("message", (message) => {
document.querySelector(
"#output",
).textContent = `${message.data} 個の素数を生成しました。`;
});

document.querySelector('#reload').addEventListener('click', () => {
document.querySelector('#user-input').value = '[素数の生成]を押した後、すぐにここに入力してみてください。';
document.querySelector("#reload").addEventListener("click", () => {
document.querySelector("#user-input").value =
"[素数の生成]を押した後、すぐにここに入力してみてください。";
document.location.reload();
});
```
Expand All @@ -183,19 +189,18 @@ document.querySelector('#reload').addEventListener('click', () => {
// メインスレッドからのメッセージを待ち受けします。
// メッセージのコマンドが "generate" であれば、 `generatePrimes()` を呼び出します。
addEventListener("message", (message) => {
if (message.data.command === 'generate') {
if (message.data.command === "generate") {
generatePrimes(message.data.quota);
}
});

// Generate primes (very inefficiently)
function generatePrimes(quota) {

function isPrime(n) {
for (let c = 2; c <= Math.sqrt(n); ++c) {
if (n % c === 0) {
return false;
}
return false;
}
}
return true;
}
Expand Down
Loading