# JavaScript arrow funksiyalar (=>)

> Arrow funksiya sintaksisi: qisqa yozuv, yashirin return, bir qatorli shakl va oddiy funksiyadan farqi. Callback yozishni qulaylashtirishni o'rganing.

Manba: https://learncode.uz/javascript/arrow-funksiyalar/
Sana: 2026-05-31

[Massiv metodlari](https://learncode.uz/javascript/massiv-metodlari) darsida `narx => narx * 0.9`
kabi yozuvni ko'rgansiz. Bu — **arrow funksiya**: qisqa va callback uchun
maxsus qulay shakl.

## Oddiy funksiyadan arrow'ga

Bir xil ish, uch xil yozuv:

```js
function square1(n) {
  return n * n;
}

const square2 = (n) => {
  return n * n;
};

const square3 = (n) => n * n;

console.log(square1(5));
console.log(square2(5));
console.log(square3(5));
```

Uchalasi bir xil natija beradi. Farq — faqat yozuvda.

## Qisqartirish qoidalari

Arrow funksiyani bosqichma-bosqich qisqartirish mumkin:

```js
const a = (n) => { return n + 1; };

const b = (n) => n + 1;

const c = n => n + 1;

console.log(a(10), b(10), c(10));
```

- Tana bitta `return` bo'lsa — figurali qavs va `return` tushiriladi
  (**yashirin return**);
- parametr bitta bo'lsa — qavs ham tushiriladi.

<Callout type="warning" title="Nol yoki ikki parametr — qavs shart">
Parametr bo'lmasa yoki bittadan ko'p bo'lsa, qavs **majburiy**:

```js
const greet = () => "Salom";        // qavs bo'sh, lekin present
const sum = (a, b) => a + b;    // ikkita — qavs shart
```
</Callout>

## Obyekt qaytarish

Yashirin return bilan obyekt qaytarishda tuzoq bor:

```js
const wrong = (name) => { name: name };
console.log(wrong("Aziz"));

const correct = (name) => ({ name: name });
console.log(correct("Aziz"));
```

Birinchi holatda `{` ni JavaScript **funksiya tanasi** deb o'qidi, obyekt
deb emas — natija `undefined`. Obyektni yumaloq qavsga o'rash muammoni
hal qiladi.

## Callback'da eng foydali

Arrow funksiya [massiv metodlari](https://learncode.uz/javascript/massiv-metodlari) bilan birga
eng ko'p ishlatiladi:

```js
const numbers = [5, 12, 8, 130, 44];

console.log(numbers.map(n => n * 2));
console.log(numbers.filter(n => n > 10));
console.log(numbers.reduce((a, b) => a + b, 0));
console.log(numbers.sort((a, b) => a - b));
```

Eski yozuv bilan solishtiring:

```js
numbers.map(function (n) {
  return n * 2;
});
```

Bir amal uchun uch qator — arrow bilan bitta.

## this — asosiy farq

Arrow funksiyaning oddiy funksiyadan **haqiqiy** farqi sintaksis emas, balki
`this` ga munosabati. Oddiy funksiya `this` ni o'zi hosil qiladi; arrow
funksiya esa uni **tashqi kontekstdan** oladi:

```js
const counter = {
  count: 0,
  steps: [1, 2, 3],

  calculate() {
    this.steps.forEach((s) => {
      this.count += s;
    });
    return this.count;
  },
};

console.log(counter.calculate());
```

Bu yerda `forEach` ichidagi arrow funksiya `this` ni tashqaridagi
`calculate` metodidan oldi — shuning uchun `this.count` ishladi.

Oddiy funksiya bilan bu buziladi:

```js
const counter = {
  count: 0,
  steps: [1, 2, 3],

  calculate() {
    this.steps.forEach(function (s) {
      this.count += s;
    });
    return this.count;
  },
};

console.log(counter.calculate());
```

Natija `0` — ichkaridagi `this` boshqa narsani ko'rsatdi. `this` mavzusi
[alohida darsda](https://learncode.uz/javascript/this-kalit-sozi) batafsil ko'riladi.

> **Atama**
>
> **Callback** — boshqa funksiyaga **argument sifatida uzatiladigan** funksiya.
> `map(n => n * 2)` da arrow funksiya callback: `map` uni har element uchun
> o'zi chaqiradi.

## Qachon ishlatmaslik kerak

Arrow funksiya obyekt metodi sifatida yaramaydi:

```js
const student = {
  name: "Aziz",
  greet: () => {
    console.log("Men " + this.name);
  },
};

student.greet();
```

`undefined` chiqdi — arrow `this` ni obyektdan olmaydi. Metod uchun qisqa
yozuvni ishlating:

```js
const student = {
  name: "Aziz",
  greet() {
    console.log("Men " + this.name);
  },
};

student.greet();
```

## Amaliy mashq

1. `(a, b) => a * b` ko'paytirish funksiyasini yozing;
2. uni to'liq `function` shaklida qayta yozing;
3. massivdagi matnlarni bosh harfga o'girish uchun `map` + arrow ishlating;
4. `{ ism, yosh }` obyekt qaytaradigan arrow funksiya yozing (qavsni unutmang);
5. obyekt metodini arrow bilan yozib ko'ring — `this` nima bo'ladi?

5-qadam arrow funksiyani qayerda ishlatmaslik kerakligini ko'rsatadi.

## Qisqacha xulosa

- Arrow funksiya `=>` bilan yoziladi: `(a, b) => a + b`.
- Tana bitta ifoda bo'lsa `return` yozilmaydi — **yashirin return**.
- Bitta parametrda qavs tushadi; nol yoki ikkitada — shart.
- Obyekt qaytarishda yumaloq qavsga o'rash kerak: `() => ({ ... })`.
- Arrow `this` ni **tashqi kontekstdan** oladi — callback uchun ideal,
  obyekt metodi uchun yaramaydi.

Keyingi darsda [callback funksiyalar](https://learncode.uz/javascript/callback) va ular orqali
asinxron kodga o'tamiz.