中に入る。

JavaScriptで符号化する場合、文字列の組み合わせはよくあります.
あなたは今でもconcat、join、+を組み合わせていますか?
性能、使用状況は異なる場合がありますが、組み合わせが複雑であると一目瞭然になりにくい場合があります.
今回は、文字列を組み合わせる方法でModernJavaスクリプト(ES 6+)で使用される템플릿 리터럴について説明します.

文字列の組合せ

私は今よく使っていますが、これを学ぶ必要がありますか?理解してる...🙄
上述したように,開発では文字列をよく組み合わせた.
普通の文字列を組み合わせると、目で見ると少し複雑に見えます.
一人開発であれば、この部分でどの文字列をマージするかはよくわかりますが、コラボレーションの観点からは、一目瞭然ではないコードが悪いことがわかります.
例を見てみましょう.

URL文字列の組合せ

私が用意した例はURLの組み合わせです.
通常、API要求がGETである場合、パラメータ値は一緒にURLに渡される.
1つ程度のパラメータ値はわかりやすいかもしれませんが、数が多ければ多いほどわかりにくくなります.+、concat、joinと템플릿 리터럴の違いを理解します.
私たちが要求するAPI情報を以下に示すと仮定します.

API URL [GET] : https://api.testUrl.com/user

option : date, name, age, company, id

{
  date : 가입일자
  name : 이름
  age : 나이
  company : 회사명
  id : 아이디
}

case 1:+記号の使用

まず、userの이름(name)が「黄州県」のデータを要求したと仮定する.
最終的には、文字列https://api.testUrl.com/user?name=황주현を生成したいと思います.

const mergeUrl = ({name}) => {
  return 'https://api.testUrl.com/user' + '?name=' + name;
}

?... コードの理解はいいですね?🤨
そうだ.これまでは理解できる範囲だった.
もしそうであれば、リクエストuserの이름(name)は황주현であり、나이(age)は24であり、아이디(id)はhimproverのデータである.

const mergeUrl = ({name, age, id, date}) => {
  return 'https://api.testUrl.com/user' + '?name=' + name+ '&age=' + age + '&id=' + id + '&date=' + date;
}

(サンプル作成時にも混同されていました...)
本当に一気に理解できますか?
他の開発者はおろか、編纂者も混乱しそうだ.가입일자(date)SIGNまたは2022-03-24SIGNがシンボルを1つ漏らした日は、エラーを見つけるのに少し時間がかかる可能性があります.
これは他の方法と何の違いもありません.

case 2:=の使用

const mergeUrl = ({name, age, id, date}) => {
  return 'https://api.testUrl.com/user'.concat('?name=', name, '&age=', age, '&id=', id, '&date=', date);
}

Case 3:&使用

const mergeUrl = ({name, age, id, date}) => {
  return ['https://api.testUrl.com/user', '?name=', name, '&age=', age, '&id=', id, '&date=', date].join();
}

このように、文字列とURLなどの変数が複合されていると、それらを識別するのは難しい.
テンプレートライブラリでは、これらの問題を解決できます.

Case 4:concatの使用

const mergeUrl = ({name, age, id, date}) => {
  return `https://api.testUrl.com/user?name=${name}&age=${age}&id=${id}&date=${date}`;
}

!!!!!!!!
どうですか.何か複雑な構造が解消されていて、URLの構造が見られなかったのでしょうか?
これはjoinを使用する場合の利点です.
では、使い方を見てみましょう.

テンプレート文字の使用方法

使用템플릿 리터럴または템플릿 리터럴とは異なり、' 'は" "を使用します.템플릿 리터럴と呼ばれ、通常はキーボードの最左上隅``の下백틱に位置する.
文字列は既存のように記述されますが、変数を使用する必要がある部分ではESCフォーマットが使用されます.
使い方は難しくなく、一度使っても忘れません.
先に記述した~の例に値を入力すると、結果の出力が良好であることが保証されます.

実際,${변수명}内部では変数だけでなく関数も使用できる.
一度自分で書いてみて、使い方を検討してみましょう.

整理する

本稿では、템플릿 리터럴を使用して文字列を組み合わせる利点について説明します.
でも、ちょっと注意が必要です.
この文章はほめ言葉ではない.
文字列の組み合わせに正解はなく、様々な機能の状況を考慮して最適なものを使用する必要があります.
各コマンドの役割が異なるからです.
配列を結合するための特殊な関数、重複文を減らすための特殊な関数などの関連機能を理解し、現在の状況で最も使用に適した関数を選択することが重要です.
適切な関数を使用して、モダンJavaスクリプトにさらに近づきましょう.

${ }backtic(템플릿 리터럴)を使用して作成します.

変数を加えるには템플릿 리터럴に入れるだけです.

変数に加えて、関数も使用できます.

템플릿 리터럴必ずしも正しいとは限りませんが、状況に応じて適切なオプションを使用してください.

+ 읽어주셔서 감사합니다.
+ 오타, 내용 지적, 피드백을 환영합니다. 많이 해주실 수록 제 성장의 밑거름이 됩니다.