Number("123");    // returns 123
Number("123abc"); // returns NaN
Number("");       // returns 0

const str = new String("JasX");

Boolean("");           // false
Boolean(null);         // false
Boolean(undefined);    // false
Boolean(NaN);          // false

Boolean("hello");      // true
Boolean([]);           // true
Boolean({});           // true

let bigIntFromNumber = BigInt(9007199254740992);
console.log(bigIntFromNumber); // 9007199254740992n

let bigIntFromString = BigInt("9007199254740992");
console.log(bigIntFromString); // 9007199254740992n

let sym1 = Symbol("desc");
let sym2 = Symbol("desc");

console.log(sym1 === sym2); // false

let a;
console.log(a); // undefined

let obj = {
    key: value
};

let obj = new Object();

obj.key = 'value';

console.log(obj.key); // {key: 'value'}

let arr = []
function log() {}

console.log(typeof arr); // object
console.log(typeof log); // function    .

Number = (-1)^sign × (1 + mantissa) × 2^exponent

Agar Number bu qiymatdan ortib ketsa, maximum precision 53 bit'dan oshib ketadi. Natijada, Aniqlikda xatoliklar va Hisoblashda noaniqliklar kelib chiqadi.

Web Sahifa'ga tashrif buyurilgan qurilmani aniqlash responsiv dizayn, analitika, feature o'zgartirish kabi vazifalar uchun foydali bo'ladi.

console.log(navigator.userAgent);

// Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/128.0.0.0 Mobile Safari/537.36 

const str = 'table football';
const regex = new RegExp('foo');

console.log(regex.test(str)); // true

const detectDeviceType = () => /Mobile|Android|iPhone|iPad/i.test(navigator.userAgent) ? 'Mobile' : 'Desktop';

detectDeviceType();

Kelajakda browser'larda .userAgent() ishlamasligi mumkin, ya'ni browser o'zi haqida ma'lumot bermasligi mumkin.

video.currentTime = matchedTime;
video.play();

Navigator dasturchilarga foydalanuvchining veb-brauzeriga kirish va u bilan o‘zaro aloqada bo‘lish imkonini beradi, bu dasturchilarga website'ni yanada yaxshilashga yordam beradi

let navigatorObject = window.navigator;

⚠️ Navigator Object xususiyatlari foydalanuvchining brauzeri haqida har doim aniq ma’lumot bermasligi mumkin. Masalan, foydalanuvchilar eskirgan yoki o‘zgartirilgan brauzerlardan foydalanayotgan bo‘lishi mumkin, bu esa noto‘g‘ri ma’lumotlarga olib keladi. Bundan tashqari, barcha brauzerlar Navigator obyektining barcha funksiyalarini qo‘llab quvvatlamaydi.

Battery Status API ko‘plab yangilangan brauzerlarda privacy concerns sababli qo‘llab-quvvatlanmaydi. Bu API eski versiyadagi Chrome, Edge va ba’zi boshqa brauzerlarda ishlaydi, lekin Firefox yoki Safari’da ishlamasligi mumkin.

if ('getBattery' in navigator) {
  navigator.getBattery().then((battery) => {
    console.log(`Battery level: ${battery.level * 100}%`);
    console.log(`Charging: ${battery.charging ? 'Yes' : 'No'}`);
  });
} else {
  console.log('Battery Status API is not supported in this browser.');
}

Storage class'lar o'zgaruvchilar xotirada qanday saqlanishini, qancha vaqt davomida mavjud bo'lishini, va qayerda foydalanilishi mumkinligini boshqaradi.

auto int a = 5; 

int a = 5;

C++'da O'zgaruvchilar default holatda auto bo'lgani uchun, auto keyword kam holatda ishlatilinadi.

register int counter = 5;

register storage class o'zgaruvchilari ham automatic xotiraga saqlash xususiyatiga ega.

#include <iostream>
using namespace std;

void example() {
    // Local scope
    static int x = 0; 
    x++;
    cout << x << endl;
}

int main() {
    example(); // Output: 1
    example(); // Output: 2

    return 0;
}

auto vs static asosiy farqlari, auto o'zgaruvchilar har block yoki funsiya ishlashni boshlaganda xotiraga saqlanib, ishlashdan to'xtaganda olib tashlanadi. static o'zgaruvchi esa to'liq program ishlaganda saqlanadi

#include <iostream>
using namespace std;

extern int counter;

void increment() {
  counter++;
  cout << "Counter: " << counter << endl;
}

#include <iostream>
using namespace std;

extern int counter;
extern void increment();

int counter = 0;

int main() {
    cout << "Initial counter: " << counter << endl;
    increment();
    cout << "After increment: " << counter << endl;

    return 0;
}

React 19 foydalanishga tayyor (stable) bo'libdi!

Eski brauzerlarga ham qo'llab-quvvatlash kerak bo'lsa, boshqa yo'llardan foydalangan yaxshiroq, ammo u yo'l biroz murakkab

 if (navigator && navigator.clipboard && navigator.clipboard.writeText) return 'true'

navigator.clipboard.writeText("Selected Text");

const copyToClipboard = str => {
  if (navigator && navigator.clipboard)
    return navigator.clipboard.writeText(str);
  return Promise.reject('API is not available.');
};

navigator.clipboard.readText()

navigator.clipboard
 .readText()
 .then(text=>{document.getElementById('outputText').value = text})

navigator.clipboard
  .writeText(textToCut)
  .then(() => { inputField.value = '' })

Menimcha ko'pchilik bu muommo'ga duch kelgan !

{
    "rewrites": [
        {"source": "/(.*)", "destination": "/"}
    ]
}

/*    /index.html   200 

try {
  // Some error message
} catch (e) {
  window.open(`https://stackoverflow.com/search?q=[js]+${e}`, '_blank');
}

Linked List insertion (yangi element qo'shish) yoki deletion (mavjud elementni olib tashlash) uchun Array'ga nisbatan osonroq va samaraliroq hisoblanadi

⚠️ Kompyuter o'zining arxitekturasiga va o'zgaruvchini e'lon qilgan dastur tiliga qarab, qoidalar va bit'lar o'zgarishi mumkin.

Address Value
-----------------------
0x7F28 - 3
0x7F29
0x7F30 - 5
0x7F31
0x7F32 - 13
0x7F33

⚠️ Bu real vaqt tizimlarida muammolarni keltirib chiqarishi mumkin.

Linked List Array'ga nisbatan 2 marta ko'proq xotira egallaydi. Chunki, Linked List har bir node uchun qo‘shimcha pointer (yoki reference) saqlaydi, bu esa qo‘shimcha xotira talab qiladi.

class Node {
    constructor(data) {
        this.data = data
        this.next = null                
    }
}

class LinkedList {
   constructor() {
    this.head = null;
    this.tail = null;
  }
}

add(data) {
  const node = new Node(data);

  if (this.head === null) {
    this.head = node;
  } else {
    this.tail.next = node;
  }

  this.tail = node;

  printAll() {
    let current = this.head;

    while (current !== null) {
      console.log(current.data);
      current = current.next;
    }
  }

const list = new LinkedList();

list.add(1);
list.add(2);
list.add(3);
list.add(4);

list.printAll();

 get(index) {
    let current = this.head;
    let i = 0;

    while (i < index) {
      current = current.next;
      i++;
    }

    return current.data;
  }

Lazy loading - bu veb-sahifaning ma’lum qismlarini foydalanuvchi yoki brauzerga kerak bo'lmaguncha yuklamasdan kutib turish (render qilish jarayonini to'xtatib turish)

"above the fold" va "below the fold" gazeta maketlaridan kelib chiqqan. Gazetalar, odatda, gorizontal bo‘yicha ikkiga buklangan, oldingi yarmi esa buklangan joydan yuqorida joylashgan bo‘ladi.

<img src="example.com/image" loading="lazy">

<img src="example.com/image" loading="eager">

import React, { Suspense } from "react";

const LazyComponent = React.lazy(() => import("./LazyComponent"));

function App() {
  return (
    <div>
      <h1>Welcome to My App</h1>
      <Suspense fallback={<div>Loading...</div>}>
        <LazyComponent />
      </Suspense>
    </div>
  );
}

export default App;

const routes: Routes = [
  {
    path: 'items',
    loadChildren: () => import('./items.module').then(m => m.ItemsModule)
  }
];

React component'ni Angular project'da ishlatib ko'rdim.

npm install react react-dom

{
     .....
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
     .....
}

npm install --save-dev @types/react @types/react-dom

{
  "compilerOptions": {
    "jsx": "react"
  }
}

import React from 'react';

const HelloReact = () => {
  return <div>Hello from React!</div>;
};

export default HelloReact;

import React from 'react';
import ReactDOM from 'react-dom/client';
import HelloReact from './HelloReact';

export function renderReactComponent(container: HTMLElement) {
  const root = ReactDOM.createRoot(container);
  root.render(<HelloReact />);
}

@Component({
  selector: 'app-react-wrapper',
  template: `<div id="react-root"></div>`,
  standalone: true,
})

export class ReactWrapperComponent implements AfterViewInit {
  constructor(private elRef: ElementRef) {}

  ngAfterViewInit() {
    const container = this.elRef.nativeElement.querySelector('#react-root');
    renderReactComponent(container);
  }
}

<app-react-wrapper></app-react-wrapper>

Frontend loyihalar (masalan, React) yangilanganda, foydalanuvchilarning brauzeri ko‘pincha eski fayllarni keshlangan (cache) holatda saqlab qoladi.

main.js → main.a3f5s3.js

export default defineConfig({
  build: {
    outDir: 'dist',
    assetsDir: 'assets',
    rollupOptions: {
      output: {
        entryFileNames: 'assets/[name].[hash].js',
        chunkFileNames: 'assets/[name].[hash].js',
        assetFileNames: 'assets/[name].[hash].[ext]',
      },
    },
  },
})

@NgModule({
  declarations: [MyComponent],
  exports: [MyComponent]
})
export class MyModule {}

Agar komponent declarations'ga qo‘shilgan bo‘lsa, uni faqat o‘sha modul ichida ishlatish mumkin. Uni boshqa modul'da ishlatish uchun, export qilingan bo‘lishi va modul import qilingan bo‘lishi kerak.

@Component({
  standalone: true,
  selector: 'app-hello',
  template: '<p>Hello!</p>',
  imports: [CommonModule]
})
export class HelloComponent {}

import Card from './Card'

imports: [CardComponent]

React component'lar ham standalone component hisoblanadi