Apa arti $ {} (tanda dolar dan kurung kurawal) dalam string di Javascript?

160

Saya belum melihat apa pun di sini atau di MDN. Saya yakin saya hanya melewatkan sesuatu. Pasti ada dokumentasi tentang ini di suatu tempat?

Secara fungsional, sepertinya Anda dapat membuat variabel di dalam string tanpa melakukan penggabungan menggunakan +operator. Saya mencari dokumentasi tentang fitur ini.

Contoh:

var string = 'this is a string';

console.log(`Insert a string here: ${string}`);

Luaskan cuplikan

— Darren Joy
sumber

Bisakah Anda memberikan konteks pada apa yang Anda tanyakan? Pertanyaan ini tidak jelas seperti yang tertulis.

— Sam Hanley

3

ECMAScript 2015 templat literal

5

Ini bukan pertanyaan yang buruk. Ini adalah fitur baru, dan saya yakin tidak dapat menemukan duplikat pada SO, meskipun sebuah contoh dari apa yang sebenarnya dilihat sudah baik.

@ juling — setuju, tetapi kode sampel dan referensi ke sumber akan sangat membantu.

— RobG

Contoh ditambahkan. Referensi ada dalam tantangan pengkodean tetapi itu diberikan, seolah-olah itu adalah sesuatu yang baru saja Anda gunakan. Belum melihat apa pun di sana dan tidak bisa menemukan apa-apa juga. (Selama beberapa tahun terakhir saya tidak pernah bertanya Q di sini. SO sepertinya memiliki hampir segalanya sekarang ...)

— Darren Joy

192

Anda sedang berbicara tentang templat literal .

Mereka memungkinkan untuk string multiline dan interpolasi string.

String multiline:

console.log(`foo
bar`);
// foo
// bar

Luaskan cuplikan

Interpolasi string:

var foo = 'bar';
console.log(`Let's meet at the ${foo}`);
// Let's meet at the bar

Luaskan cuplikan

— Rick Runyon
sumber

67

Satu hal yang membingungkan saya untuk waktu yang lama adalah bahwa templat literals menggunakan backtick, yang ada di sebelah kiri "1" pada keyboard, bukan tanda kutip tunggal (').

— Sydney

19

Keren: Anda bahkan dapat "menyuntikkan" kode:console.log(`Your array:\n ${arr.join('\n ')}`)

— T4NK3R

5

Aneh bahwa Template Literaltidak didukung di IE atau mungkin itu wajar untuk IE tidak mendukung hal-hal keren. Baca selengkapnya

— Mohammad Musavi

12

Seperti disebutkan dalam komentar di atas, Anda dapat memiliki ekspresi di dalam string templat / literal. Contoh:

const one = 1;
const two = 2;
const result = `One add two is ${one + two}`;
console.log(result); // output: One add two is 3

Luaskan cuplikan

— Joel H
sumber

Apakah benar mengatakan bahwa string template dapat digunakan untuk menyuntikkan kode ke dalam string?

— carloswm85

Anda menyuntikkan ekspresi dan ekspresi adalah kode. Anda tidak dapat menyuntikkan semua jenis kode, namun, hanya ekspresi JavaScript.

— Joel H

Saya akan mencoba untuk lebih spesifik. Saat menggunakan string literal saya bisa menyuntikkan ekspresi suka obj.value DI DALAM string apa pun menggunakan notasi $ {}. Baik?

— carloswm85

Ya, dan Anda dapat mencobanya sendiri di konsol, misalnyahey ${obj.name}

— Joel H

0

Anda juga dapat melakukan Konversi Jenis Tersirat dengan literal templat. Contoh:

let fruits = ["mango","orange","pineapple","papaya"];

console.log(`My favourite fruits are ${fruits}`);
// My favourite fruits are mango,orange,pineapple,papaya

— Shalom David
sumber