> ## Documentation Index
> Fetch the complete documentation index at: https://help.dingtalk.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Tentang binding this

> Pahami cara kerja binding this di JavaScript pada action panel YiDA — termasuk pengaruh kata kunci export, metode bind ES5, dan arrow function ES2015 terhadap konteks rendering engine.

## 1. Latar belakang

* Untuk memahami binding this, pertama-tama Anda harus memahami cara kerja this di JavaScript.
* Pada sebagian besar kasus, nilai this ditentukan oleh cara sebuah fungsi dipanggil (runtime binding). Nilai ini tidak dapat ditetapkan saat eksekusi dan bisa berbeda setiap kali fungsi dipanggil. ES5 memperkenalkan metode bind untuk menetapkan nilai this pada sebuah fungsi terlepas dari cara fungsi tersebut dipanggil. ES2015 memperkenalkan arrow function yang tidak menyediakan binding this-nya sendiri (this mempertahankan nilai dari konteks leksikal yang membungkusnya).

<Card title="this - JavaScript | MDN https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this" icon="bookmark" href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this" horizontal />

## 2. this pada action panel YiDA

* Setelah memahami cara kerja this di JavaScript, Anda hanya perlu memeriksa apakah kata kunci export digunakan saat memanggil fungsi pada action panel YiDA.
* Rekomendasi: Untuk fungsi utilitas murni yang tidak melibatkan konteks halaman apa pun — misalnya, membuat string acak dengan function uid() \{ return new Date().getTime().toString(32); } — jangan gunakan kata kunci export. Selain itu, semua metode harus menggunakan kata kunci export dan dipanggil dengan this.

Contoh 1

```jsx theme={"theme":{"light":"github-light","dark":"github-dark"}}
export function a() {
  console.log(this);
}

export function b() {
  this.a(); // Benar. Metode a dapat mengakses konteks this rendering engine YiDA dengan benar.
  a(); // Salah. Metode a tidak dapat mengakses konteks this rendering engine YiDA.
}
```

Contoh 2

```jsx theme={"theme":{"light":"github-light","dark":"github-dark"}}
function a() {
  console.log(this);
}

export function b() {
  this.a(); // Salah dan memicu error. Metode a tidak diimpor melalui kata kunci export, sehingga tidak dapat dipanggil menggunakan konteks this rendering engine YiDA.
  a(); // Salah. Metode a tidak dapat mengakses konteks this rendering engine YiDA.
}
```

Contoh 3

```jsx theme={"theme":{"light":"github-light","dark":"github-dark"}}
export function a() {
  console.log(this);
}

function b() {
  a(); // Salah. Metode b tidak menggunakan kata kunci export dan tidak dipanggil melalui this.a(), sehingga metode a tidak dapat mengakses konteks this rendering engine YiDA.
}
```