๐ปtemplate๐ป
- template String, template literals ๋ผ๊ณ ๋ ํ๋ค.
- ES6(ECMAScript 2015)์์ ์ถ๊ฐ๋ ๋ฌธ์์ด ํ๊ธฐ๋ฒ์ด๋ค.
- ๋ฐฑ์ฟผํธ ๋๋ ๋ฐฑํฑ(`) ์ฌ์ฉํ์ฌ ์ ์ํ๋ฉฐ, ${}๋ฅผ ์ฌ์ฉํ์ฌ ๋ณ์๋ ํํ์์ ์ฝ๊ฒ ๋ฌธ์์ด ์์ ์ฝ์ ํ ์ ์๋ค.
JavaScript ๋ฌธ์์ด ํ๊ธฐ๋ฒ์ผ๋ก ์๋ 3๊ฐ์ง๊ฐ ์๋ค.
1. 'string'
2. "string"
3. `string` > template string
<script>
let a = 'ํ๊ธธ๋';
let b = "ํ๊ธธ๋";
let c = `ํ๊ธธ๋`;
console.log(a === b); //true
console.log(a === c); //true
</script>
ํ๊ธฐ๋ฒ์ ์ด๋ค ๊ฒ์ผ๋ก ํ๋ ์ง ํ์์ ๋์ผํ๋ค.
template ์ฌ์ฉ๋ฒ
<script>
let name = 'ํ๊ธธ๋';
let age = '20';
console.log(`์ด๋ฆ์ ${name}์ด๊ณ , ๋์ด๋ ${age}์ธ์
๋๋ค.`)
</script>
<script>
let temp = `
ํ๋
๋
์
`;
console.log(temp);
let temphtml = `
<tr>
<td>text</td>
</tr>
<tr>
<td>text</td>
</tr>`;
</script>
innerHTML์ ์ฌ์ฉํ๋ ๊ฒฝ์ฐ ๋๋ ๋ค๋์ ํ ์คํธ๋ฅผ ์กฐ์ํ ๋ ์ํฐ๋ฅผ ๋ฃ์ ์ ์๋ค.
'WEB > JavaScript' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
[JavaScript] ์ด๋ฒคํธ์ Hover Table(2) (0) | 2023.10.11 |
---|---|
[JavaScript] ์ด๋ฒคํธ ๋ฒ๋ธ๋ง, ์ด๋ฒคํธ ํฐ๋๋ง (0) | 2023.10.11 |
[JavaScript] ํจ์๋ 1๊ธ ๊ฐ์ฒด์ด๋ค. (0) | 2023.10.11 |
[JavaScript] object (0) | 2023.10.11 |
[JavaScript] (์๋)์ฝ๋ ์ฌ๋ฐฐ์น : hoisting (0) | 2023.10.11 |