Bir işlevi çağıran ters vuruşlar

Bunu nasıl açıklayacağımı bilmiyorum ama koştuğumda

console.log`1`

Google chrome'da şöyle çıktı alıyorum

console.log`1`
VM12380:2 ["1", raw: Array[1]]

Backtick neden log işlevini çağırıyor ve neden bir indeks oluşturuyor raw: Array[1]?

JS odasında Catgocat tarafından sorulan soru, ancak bunun neden olduğuna gerçekten uymayan dizeleri şablonlamakla ilgili bir şey dışında hiçbir cevap mantıklı gelmiyordu.

ES-6'da Etiketli Şablon deniyor onlar hakkında daha fazla bilgi okunabilir Burada , komik bağlantıyı çok sohbetin yıldızlı bölümünde buldum.

Ancak kodun ilgili kısmı aşağıdadır (temelde filtrelenmiş bir sıralama oluşturabilirsiniz).

function tag(strings, ...values) {
  assert(strings[0] === 'a');
  assert(strings[1] === 'b');
  assert(values[0] === 42);
  return 'whatever';
}
tag `a${ 42 }b`  // "whatever"

Temel olarak, başka herhangi bir işlevde olduğu gibi, sadece "1" 'i console.log işlevi ile etiketlemektedir. Etiketleme işlevleri, şablon dizgelerinin çözümlenmiş değerlerini ve üzerinde başka görevlerin gerçekleştirilebileceği değerleri ayrı ayrı kabul eder.

Babel yukarıdaki kodu şuraya aktarır:

var _taggedTemplateLiteralLoose = function (strings, raw) { strings.raw = raw; return strings; };

console.log(_taggedTemplateLiteralLoose(["1"], ["1"]));

Yukarıdaki örnekte görebileceğiniz gibi, babel tarafından aktarıldıktan sonra, etiketleme işlevine (console.log) aşağıdaki es6-> 5 aktarılmış kodun dönüş değeri iletilmektedir.

_taggedTemplateLiteralLoose( ["1"], ["1"] );

Bu işlevin dönüş değeri, daha sonra diziyi yazdıracak olan console.log'a iletilir.

Etiketli şablon değişmezi:

Aşağıdaki sözdizimi:

function`your template ${foo}`;

Etiketli şablon değişmezi olarak adlandırılır .

Etiketli şablon değişmezi olarak adlandırılan işlev, argümanlarını aşağıdaki şekilde alır:

function taggedTemplate(strings, arg1, arg2, arg3, arg4) {
  console.log(strings);
  console.log(arg1, arg2, arg3, arg4);
}

taggedTemplate`a${1}b${2}c${3}`;

1. İlk argüman, tüm bireysel dize karakterlerinin bir dizisidir
2. Kalan argüman, dize enterpolasyonu yoluyla aldığımız değişkenlerin değerlerine karşılık gelir. Örnekte hiçbir değer olmadığına arg4(çünkü yalnızca 3 kez dize enterpolasyonu olduğundan) ve bu nedenle undefinedgünlüğe kaydetmeye çalıştığımızda günlüğe kaydedildiğine dikkat edin.arg4

Rest parametresi sözdizimini kullanarak:

Şablon dizgisinde kaç kez dize enterpolasyonunun yer alacağını önceden bilmiyorsak, genellikle rest parametresi sözdizimini kullanmak yararlıdır. Bu sözdizimi, işlevin bir diziye aldığı kalan argümanları saklar. Örneğin:

function taggedTemplate(strings, ...rest) {
  console.log(rest);
}

taggedTemplate `a${1}b${2}c${3}`;
taggedTemplate `a${1}b${2}c${3}d${4}`;