Misol :
console.log(1);
setTimeout(() => {
console.log(2);
}, 1000);
console.log(3);
setTimeout(() => {
console.log(4);
}, 3000);
console.log(5)
// Output 1 3 5 2 4
1.
console.log(1) call stack'ga tushadi va sinxron funksiya bo'lgani uchun birdaniga run bo'lib ekranga 1 chiqadi.2. Call Stack bo'shagandan keyin
setTimeout() tushadi va bu asinxron funksiya bo'lgani uchun Javascript Engine bu funksiyani Web API'ga jo'natadi. Web API'da vaqt hisoblanib tugagandan keyin Callback Queue'ga jo'natiladi va MacroTask'ga joylashadi.3. Yana
console Stack'ga tushadi va run bo'ladi.4. Navbat 3 sekundlik
setTimeout()'ga keladi va MacroTaskga jo'natiladi.Eng oxirida hamma sinxron funksiyalar bajarilib boi'lgandan keyin Call Stack bo'shaydi va navbat Callback Queue'ni ichidagi asinxron funksiyalarga keladi. Macrotask'dagi asinxron funksiyalar navbat bilan ketma ketlikda Call Stack'ga o'ta bo'shlaydi va
run bo'ladi.// Output: 1 3 5 2 4
1 3 5 - sinxron funksiya output
2 4 - asinxron funksiya output
Bir vaqtning o'zida Microtask'da Promise va Macrotask'da setTimeout funksiya to'g'ri kelib qolsa Event Loop promise funksiyani birinchi Call Stack'ga jo'natadi.
Callback Queue'dagi funksiyalarni yana qayta Call Stack'ga chiqaruvchi mexanizm EVENT LOOP deyiladi.
Loupe'da Event Loop'ni qanday ishlashini yaxshiroq ko'rish va tekshirish mumkin.
#javascript #eventLoop
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥4🎉2❤1
Qidiruv tizimini optimallashtirish.
Bu foydalanuvchilar website'ni Google, Microsoft Bing va boshqa qidiruv tizimlaridan qidirganda yuqori o'rinda ko'rinishini optimallashtirish jarayoni.
Technical SEO - Website'ni
arxitektura'sini yaxshilash.* robots.txt
Robots.txt fayli veb-saytlar tomonidan veb-brauzerlarga saytning qaysi sahifalari yoki bo'limlarini indekslanmaslik kerakligi haqida ko'rsatmalar berish uchun foydalaniladigan matn faylidir.
Bironta web sahifaga kirilsa, Googlebot bu page'ni ma'lumotlarini analiz qiladi va Google index'ga to'playdi
robots.txt fayl website'ning root directory'da joylashgan bo'ladi.
Youtube: youtube.com
Robot: youtube.com/robots.txt
Bu fayl bir qancha directive (ko'rsatmalar) guruhidan tashkil topgan va har bir guruh
User-agent:'dan boshlanadi.User-agent: *
// Bu directive(ko'rsatma)dan barcha web crawler foydalanadi.
Disallow: /private/
// Har qanday web crawler bu /private/ directory orqali bironta sahifaga kirmasligini ta'minlaydi.
Allow: /public/
// /public/ directory orqali kirish imkoniyatini beradi.
SEOptimer robots.txt fayl yaratish uchun
* meta tag
meta tag html faylni ichida head qismida yoziladi va
browser'ga website haqida ko'proq ma'lumot beradi.<head>
<meta name="description" content="">
<meta name="robots" content="">
<meta http-equiv="refresh" content="">
<meta name="author" content="">
<title>Example Website</title>
</head>
Generator tag yaratish uchun
* alt attribute
Bu alt attribute html img element ichida bo'ladi va browser'ga rasm haqida ma'lumot beradi.
<img src="" alt="">
Browser rasm haqida ma'lumot olganidan keyin, bu rasm qidiruv tizimida yuqori o'rinda turishiga yordam beradi.
🔗 Havola:
* developers.google.com/search/docs/crawling-indexing/robots/intro
* ahrefs.com/blog/seo-meta-tags
#seo #searchEngine
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥7👍3❤2🗿1
Closure bu JavaScript’da o’zidan tashqaridagi funksiyaning leksik muhit'dagi o’zgaruvchilarga kirish huquqi bo’lgan yopiq funksiya.
Misol:
let a = 10
function log() {
a = 5
function jasx() {
console.log(a);
}
jasx()
}
a = 20
log() // output: 5
Bu holatda
jasx() closure funksiya hisoblanadi. jasx() funksiyada console'ga a o'zgaruvchini chiqarish buyruq beriladiLekin bu funksiya ichida
a o'zgaruvchi bo'lmagani uchun o'zidan tashqaridagi funksiyadan qidiradi va o'zgaruvchi bo'lgani uchun natija 5 ga teng bo'ladi.JavaScript Engine o'zgaruvchi qidiryotganda birinichi local scope dan qidiradi natija topilmasa, global scope'ni tekshiradi
* Closure qanday ishlaydi ?
Javascript single-threaded til bo'lgani uchun, bir vaqtda bitta
execution context'ni bajaradi. Hamma context'lar esa stack'da saqlanadi.Stack esa LIFO (Last In First Out) sxema bo'yicha ishlaydi, ya'ni Oxirgi qo'shilgan kod Birinchi olib tashlanadi.
Har doim run bo'layotgan context stack'da birinchi o'rinda turadi.
Birinchi misoldagi kodni oladigan bo'lsak, u yerda 3 ta execution context bor. Global, log() va jasx() execution context.
Bu context'larni stack'da joylashish tartibi:
1.jasx() execution context
2.log() execution context
3.global execution context
Birinchi
jasx() context bajariladi va u yerdan o'zgaruvchini topolmaydi. jasx() context vazifasini bajarib bo'lgandan keyin stack'dan o'chib ketadi va navbat log() context'ga keladi. log() context'da o'zgaruvchi topilgani uchun birdan console'ga o'zgaruvchi chiqadi.Agar context'lar ichida o'zgaruvchi topilmasa,
global context'gacha o'zgaruchini izlab boradi. Unda ham topilmasa ReferenceError bo'ladiHar doim Stack'da eng pastda joylashgan va eng oxirida run bo'ladigan Context Global Execution Context hisoblanadi.
🔗 Havola:
* freecodecamp.org/news/lets-learn-javascript-closures-66feb44f6a44
#javascript #closure
Please open Telegram to view this post
VIEW IN TELEGRAM
👍4👏2❤1🔥1
Jasur - IT Blog
Photo
🔥3🎉2❤1
Jasur - IT Blog
Photo
setTimeout ichidagi callback funksiya'da i o'zgaruvchi bo'lmagani uchun
closure funksiya for'ning o'zgaruvchilarini (ya'ni i ni) olib natija 0 1 2 3 bo'lishi kerak edi. Ammo, natija 4 4 4 4Bunga asosiy sababchi
i'ni e'lon qilgan var keywordBu holatda
var block scope bo'lmagani uchun callback funksiya bitta i o'zgaruvchini qabul qiladi.Loop ishga tushadi va bu vaqtda
setTimout() vaqtni Web API'da rejalashtirib navbatini Macrotask Queue'da kutib turadi.Loop ishga tushganda
i o'zgaruvchini qiymati o'zgarib boshlaydi 0 1 2 3 va oxirgi loopda i o'zgaruvchi 4 ga aylanadi, ammo 4 loop'ga 3 dan katta bo'lgani uchun kirolmaydi va loop to'xtaydi. Endi navbat setTimeout()'ga keladi va i o'zgaruvchi 4 ga teng bo'lgani uchun console'ga 4 chiaqadiNatija: 4 4 4 4
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥4😁2🎉2❤1
1. Javascript Single-threaded tilmi yoki Multi-threaded tilmi ?
Javascript single-threaded tillar qatoriga kiradi. Bunga sabab Javascript'da 1 ta
call stack va memory heap mavjud. Shuning uchun bir vaqtning o'zida faqatgina bitta context run bo'ladi.Stack hamma javascript kodlar bajariladigan
konteyner hisoblanadi va LIFO (Last in First out) prinsip bo'yicha ishlaydi, ya'ni oxirgi qo'shilgan kod birinchi run bo'ladi. FILO (First in Last out) birinchi qo'shilgan oxiri run bo'ladi.Javascript'ni tabiati
sinxron va blocking hisoblanadi, lekin callbacks, promise, async/await, va event listener orqali asinxron bo'lib ishlay oladi.2. Javascript Engine qanday ishlaydi ?
Har qanday dasturlash tilida yozilgan kodlarni
run qilish uchun maxsus dasturlar kerak bo'ladi. Masalan, Python kodlar uchun Python interpreter. Javascript uchun esa Javascript Engine kerak bo'ladi, ammo Javascript Engine'ni yuklab o'rnatishimiz shart emas u deyarli barcha browser'larda mavjud.Javascript Engine JS kodlarni
run qilish uchun va machine code'ga o'tkazish uchun kerak bo'ladigan dastur hisoblanadi.Qachonki Javascipt kod
run bo'lganda, parser kodni o'qiydi va AST(Abstract Syntax Tree bu kodlarni sintaksis sxemasi) yaratib xotira'ga saqlaydi. Interpreter(high-level kodlarni komputer tushunadigan ko'rsatmalarga tarjima qilib beruvchi mexanizm) AST'ni jarayondan o'tkazadi va bytcode yaratadi. Bytecode Interpreter
bytcode'larni machine code'ga o'tkazadi, hosil bo'lgan machine code hardware processor tomonidan run bo'ladi.3. Javascript Event Loop nima ?
Event Loop - kodni asinxron ravishda ishga tushirish uchun asosiy mexanizm hisoblanadi.
Call Stack bu barcha
execution context'larni o'z ichida saqlaydigan va LIFO sxemasi bo'yicha ishlaydigan konteyner hisoblanadi. Bu stack'dan kodlar saralanib bajariladi. Sinxron kodlar run bo'ladi, asinxron (setTimeout, fetch requests, promises) kodlar esa Web Api'ga joylashadi. Web Api'dan esa Queue joylashadi. Oxirida stack bo'shagandan keyin EVENT LOOP asinxron kodlarni Queue'dan Stack'ga o'tkazadi.
#javascript #interview
Please open Telegram to view this post
VIEW IN TELEGRAM
👍6❤1🔥1
Javascript'da O'zgaruvchilar 3 ta scope'da ishlaydi.(Global, Local va Block scope)
Scope bu biron bir o'zgaruvchi amal qilishi ya'ni ishlatilishi mumkin bo'lgan
context yoki muhit. Masalan, funksiya ichida ochilgan o'zgaruvchi tashqarida ishlamaydi va bu funksiya o'zgaruvchi uchun scope vazifasini bajaradi.* Global Scope
Agar o'zgaruvchi global scope'da e'lon qilingan bo'lsa, bu o'zgaruvchi'ni kodni istalgan qismida foydalansa bo'ladi, funksiya, if else statement'da va h.o.
Eslatma: Global O'zgaruvchilar'dan foydalanish bir qancha buglarni keltirib chiqishi mumkin.
* Local (Function) Scope
Local scope bu
private xona'ga o'xshaydi, ya'ni bu yerda e'lon qilingan o'zgaruvchilar faqatgina o'sha xonada ishlay oladi va tashqaridan himoyalangan bo'ladi. Masalan, funksiya ichida e'lon qilingan o'zgaruvchi.* Block Scope
Block scope katta konteyner ichida ketma-ket joylashgan box'larga (qutilar'ga) o'xshaydi, ya'ni har bir quti ichida o'zgaruvchi e'lon qilsa tashqarida bu o'zgaruvchilardan foydalanib bo'lmaydi va
{} bilan o'ralgan bo'ladi.Masalan:
let x = 10
if (true) { let a = 20 }
function log() { var b = 20 }
Bu kod'da 3 ta scope mavjud.
x o'zgaruvchi global scope, a o'zgaruvchi block scope va b o'zgaruvchi local scope.* Lexical Scope
Judayam oson bo'lgan, ammo interview'da ko'p so'raladigan scope
Lexical Scope Closure'ni muhim qismlaridan hisoblanadi.
Lexical Scope
nested (ichma-ich joylashgan) funksiyalarni parent (tashqaridagi) scope'da joylashgan o'zgaruvchilar'dan foydalanishini ko'rsatadi.Masalan:
function outer() {
let x = "JasX"
function inner() {
console.log(x);
}
inner()
}
outer() // Output:JasXBu kod'da
inner() scope'da x o'zgaruvchi yo'qligi uchun parent scope, ya'ni outer() funksiyadan olyapti.🔗 freecodecamp.org/news/javascript-closure-lexical-scope
#javascript #scope
Please open Telegram to view this post
VIEW IN TELEGRAM
👍6❤2🔥1
4. var, let va const orasidagi farqi nima ?
Bu keyword'lar Javascript'da o'zgaruvchilarni e'lon qilish uchun ishlatiladi
Javascript yaratilganda
var keyword'dan foydalanilgan, 2015 yilda ES6 chiqqandan keyin let va const keyword'lar qo'shilgan.var - global yoki function scope
let - global yoki block scope
const - global yoki block scope bo'lib ishlay oladi
3 ta keyword ham global scope bo'lib ishlay oladi, lekin global scope 2 turga bo'linadi
window object'ga biriktirilgan va biriktirilmagan. let va const window object'ga biriktirilmagan global scope bo'lib ishaydi.Masalan:
var a = "var"
let b = "let"
const c = "const"
console.log(window.a); // Output: "var"
console.log(window.b); // Output: undefined
console.log(window.c); // Output: undefined
Hoisting bu Javascript'ning o'ziga xos-xususiyatlaridan biri hisoblanadi. O'zgaruvchi, funksiya va class'larni ishlatilgan joydan past'da e'lon qilinsa, Javascript Engine bu e'lon qilingan o'zgaruvchini
run bo'layotgan context'ning yuqorisiga joylashtiradi va birinchi o'qiydi.Masalan:
console.log(a);
var a = 20
Bu o'zgaruvchini'ni Engine yuqoriga joylashtiradi, ya'ni
var a;
console.log(a)
a = 20
var keyword'da e'lon qilingan o'zgaruvchi yuqori scope'ning yuqori qismida ishlatilsa undefined (e'lon qilinmagan) qaytaradi.let va const keyword'da e'lon qilingan o'zgaruvchi yuqori scope'ning yuqori qismida uninitialized (ishga tushirilmagan) qaytaradi.Bitta scope ichida
var keyword'da e'lon qilingan o'zgaruvchini 2 marta e'lon qilish mumkin, lekin let va const keyword'da e'lon qilingan o'zgaruvchini 2 marta e'lon qilish mumkin emas.var va let'ga qayta qiymat berish mumkin, lekin const keyword'ni o'zgartirib bo'lmaydi.var va let farqi:{
var x = 10
let y = 20
}
console.log(x); // Output: 10
console.log(y); // Output: Undefined let block scope bo'lgani uchun y o'zgaruvchi'ni scope'dan ({}) tashqarida foydalanib bo'lmaydi.[Bonus] For Loop
for loop'da
i o'zgaruvchini e'lon qilishda let keyword'dan foydalanish maslahat beriladi, chunki var keyword global bo'lgani uchun i o'zgaruvchini loop'dan tashqaridan foydalanish imkonini beradi va bu yaxshi holat emas.Masalan:
for (var i = 0; i < 3; i++) { }
console.log(i); // Output: 3 let block scope bo'lgandan keyin loop'dan tashqarida foydalanib bo'lmaydi.
for (let i = 0; i < 3; i++) { }
console.log(i); // ReferenceError: i is not defined 🔗 freecodecamp.org/news/var-let-and-const-whats-the-difference
#javascript #interview
Please open Telegram to view this post
VIEW IN TELEGRAM
❤6👍3🔥1
Javascript'da ma'lumot turlari 2 turga bo'linadi Primitive va Reference.
* Primitive ma'lumot turlari Immutable, ya'ni o'zgarmas hisoblanadi.
let name = "JsX";
name[0] = "T";
console.log(name); // JsX
Bu misolda
name nomli o'zgaruvchi yaratildi va qiymat berildi. Index orqali name'ning birinchi harfini o'zgartirish haqida buyruq berildi, lekin o'zgarish sodir bo'lmadi. Chunki string ma'lumot turi primitive hisoblanadi.Eslatma: Primitive ma'lumot turi o'zgarmas hisoblanadi, lekin bu const degani emas. O'zgaruvchi bitta memory location'da saqlangan holda o'zgartirish'ni iloji bo'lmasa bu o'zgaruvchi primitive hisoblanadi
let a = 10;
a = 20
Bu holatda o'zgaruvchi'ga yangi qiymat berilyapti va bu o'zgaruvchi yangi
memory location'ga saqlanadiPrimitive ma'lumot turlari: string, number, boolean, bigint, symbol, null, undefined.
* Non - Primitive ma'lumot turlari mutable, ya'ni o'zgaruvchan hisoblanadi va Reference ma'lumot turi deb ham ataladi
const jasx = {
lang: 'JS'
};
jasx.lang = "TS";
console.log(jasx); // { lang:'TS' }jasx nomli object yaratildi va lang nomli property berildi. Dot Notation orqali lang'ni qiymatini o'zgartirish haqida buyruq berildi. O'zgarish memory location o'zgarmasdan sodir bo'ldi, shuning uchun jasx o'zgaruvchi non-primitive hisoblanadi.Reference ma'lumot turlari: object.
🔗 dev.to/mrizwanashiq/primitive-and-non-primitive-56n8
#javascript #primitive #reference
Please open Telegram to view this post
VIEW IN TELEGRAM
❤5👍2🔥2
5. Javascript ma'lumot turlari ?
Javascript'da 8 ta ma'lumot turi mavjud va ular qiymatiga qarab 2 turga bo'linadi Primitive va Reference
* Primitive ma'lumot turlari: string, number, boolean, bigint, symbol, null, undefined.
* Non - Primitive ma'lumot turlari: object.
1. Number ma'lumot turi !
Number qiymati butun va kasr sonlarni ko'rsatadi.
Number() funksiya qiymatni number'ga o'tkazishda foydalaniladi.Number("123"); // returns 123
Number("123abc"); // returns NaN
Number(""); // returns 0Number ma'lumot turi 64-bitli IEEE 754 double-precision hisoblanadi, ya'ni sonlarni binary formatda ko'rsatish uchun 64 bit'dan foydalaniladi.
1 bit - musbat yo manfiy belgisi uchun
11 bit - exponent uchun (-1022 va 1023)
52 bit - kasr qismi uchun
Number ma'lumot turi
-(2^53 − 1) va (2^53 − 1) orasidagi sonlar qabul qiladiInfinity va NaN ham Number ma'lumot turiga kiradi.2. String ma'lumot turi !
String qiymati matn ma'lumot turini ko'rsatadi va qiymat 16-bit unsigned integer (UTF-16) bilan kodlangan bo'ladi.
String() funksiya string ma'lumot yaratish uchun ishlatiladi. new String() orqali String Object yaratiladi.const str = new String("JasX");3. Boolean ma'lumot turi !
Boolean ma'lumot turi
true va false qiymat ko'rsatadi va logical operator deb ham ataladi. Boolean() funksiya boolean bo'lmagan qiymatlarni true yoki false qiymatga o'tkazish uchun ishlatiladi.Boolean(""); // false
Boolean(null); // false
Boolean(undefined); // false
Boolean(NaN); // false
Boolean("hello"); // true
Boolean([]); // true
Boolean({}); // true4. BigInt ma'lumot turi !
BigInt ma'lumot turi katta raqamli qiymat qabul qiladi, ya'ni Number qabul qilolmaydigan sonlarni
-(2^53 − 1)'dan kichik va (2^53 − 1)'dan katta. BigInt() funksiya Number'larni BigInt'ga o'tkazadi primitive qiymat qaytaradilet bigIntFromNumber = BigInt(9007199254740992);
console.log(bigIntFromNumber); // 9007199254740992n
let bigIntFromString = BigInt("9007199254740992");
console.log(bigIntFromString); // 9007199254740992n
5. Symbol ma'lumot turi !
Symbol antiqa va o'zgarmas primitive qiymat hisoblanadi va Object uchun unique
key sifatida ham foydalanilishi mumkin. Symbol'ning asosiy vazifasi antiqa key yaratish va bu key boshqa Object key'lar bilan xar xil bo'lishi kafolatlangan. Symbol() funksiya antiqa key yaratish uchun ishlatiladi.let sym1 = Symbol("desc");
let sym2 = Symbol("desc");
console.log(sym1 === sym2); // false6. null ma'lumot turi !
null ma'lumot turi qiymat yo'qligini bildiradi va turli holatlarda paydo bo'lishi mumkin, masalan object'ning biron bir property'sida qiymat bo'lmasa. null boolean operator'lar uchun false qiymat beradi.
7. undefined ma'lumot turi !
undefined global object'ning xosasi va global scope o'zgaruvchisi hisoblanadi. O'zgaruvchi e'lon qilinsa, lekin qiymat berilmasa undefined qiymat beriladi.
let a;
console.log(a); // undefined
8. Object ma'lumot turi !
Object bu ma'lum bir narsaning xususiyatlar to'plami, xususiyat bu
name (key) va qiymat'ning birlashmasi. Xususiyatning qiymat har qanday ma'lumot turi bo'lishi mumkin.let obj = {
key: value
};new Object() constructor object yaratib beradi.let obj = new Object();
obj.key = 'value';
console.log(obj.key); // {key: 'value'}
Array vs Funksiya
let arr = []
function log() {}
console.log(typeof arr); // object
console.log(typeof log); // function .
Javascript'da Array ma'lumot turi mavjud emas. Array bu ma'lumot'larni to'plash uchun ishlatiladi va Object'ning ustiga qurilgan global object'ning bir turi hisoblanadi.
Funksiya'ni
typeof qilib tekshirganda Function qaytaradi. Lekin Javascript'da function ma'lumot turi mavjud emas. Funksiya Object hisoblanadi.🔗 developer.mozilla.org/en-US/docs/Web/JavaScript/Data_structures
#javascript #interview
Please open Telegram to view this post
VIEW IN TELEGRAM
❤6👍3🔥3💯1
Nega Number ma'lumot turi
Izohlarda fikringizni yozib qoldiring 👇
[-(2^53 − 1) - (2^53 − 1)]'dan tashqari sonlarni qabul qilmaydi.Izohlarda fikringizni yozib qoldiring 👇
🔥5
Jasur - IT Blog
Nega Number ma'lumot turi [-(2^53 − 1) - (2^53 − 1)]'dan tashqari sonlarni qabul qilmaydi. Izohlarda fikringizni yozib qoldiring 👇
Javascript Number ma'lumot turi IEEE 754 standarti orqali 64-bit'li ikkilik formatidagi (
double-precision) raqamlarni ko'rsatadi.IEEE 754 - floating-point arifmetikasi uchun Institute of Electrical and Electronics Engineers tomonidan ishlab chiqilgan texnik standart hisoblanadi.
64 bit - Javascript number ma'lumotlarni kodlash (encode qilish) uchun.
1 bit - musbat yo manfiy belgisi uchun
11 bit - butun sonning Exponent qismini ko'rsatadi
52 bit - kasr qismi uchun (mantissa)
Javascript number ma'lumotlarni
bit'dan numberga o'tkazish uchun shu formuladan foydalanadi.Number = (-1)^sign × (1 + mantissa) × 2^exponent
JavaScript floating-point representation
53-bit hisoblanadi. Ya'ni ( 1 + mantissa ), 1bit + 52 bit. 1 bit implicit leading bit, 52 bit implicit leading bit deyiladi.Shuning uchun Javascript floating-point uchun umumiy 53 bit sarflaydi.
Bundan kelib chiqadi:
Number.MAX_SAFE_INTEGER
2^53 – 1'ga teng. Number.MIN_SAFE_INTEGER
-(2^53 - 1)'ga teng.Agar Number bu qiymatdan ortib ketsa, maximum precision 53 bit'dan oshib ketadi. Natijada, Aniqlikda xatoliklar va Hisoblashda noaniqliklar kelib chiqadi.
🔗 developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number
Please open Telegram to view this post
VIEW IN TELEGRAM
👍2🔥2🎉1
Web Sahifa'ga tashrif buyurilgan qurilmani aniqlash responsiv dizayn, analitika, feature o'zgartirish kabi vazifalar uchun foydali bo'ladi.
Sahifa mobil qurilmada yoki kompyuterda ko'rilayotganligini aniqlash uchun
Navigator.userAgent xususiyatidan foydalaniladi.Navigator.userAgent browser'ning user agenti (user agent of the browser) qaytaradigan string'ni o'z ichiga oladi.
Masalan:
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
Navigator.userAgent qaytaradigan
string orqali qurilma turini aniqlash mumkin, bunga sabab qurilmalarda string farq qiladi.Qurilma turini aniqlash uchun qo'shimcha RegExp'dan foydalanamiz, ya'ni
RegExp.prototype.test().RegExp.prototype.test()
test() metodi regular expression'ni match qilingan ma'lumot ichidan qidiradi va mavjudligiga qarab boolean ma'lumot (true, false) qaytaradi.Masalan:
const str = 'table football';
const regex = new RegExp('foo');
console.log(regex.test(str)); // true
Mobil qurilma ekanligini aniqlash uchun
/Mobile|Android|iPhone|iPad/i Regular Expression'dan foydalanamiz.const detectDeviceType = () => /Mobile|Android|iPhone|iPad/i.test(navigator.userAgent) ? 'Mobile' : 'Desktop';
detectDeviceType();
Bu kod'da
Navigator.userAgent string qaytaradi va .test() RegExp bilan stringni test qiladi. Agar string ichida berilgan experssion mavjud bo'lsa .test() true qaytaradi. Natija, qurilma mobil bo'ladi./Mobile|Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i - Mobil qurilmani aniqlash uchun expression'ni kengaytirish mumkin.Kelajakda browser'larda .userAgent() ishlamasligi mumkin, ya'ni browser o'zi haqida ma'lumot bermasligi mumkin.
Qurilmani tekshirish uchun: device-detecting.vercel.app
🔗 30secondsofcode.org/js/s/detect-device-type
#javascript #deviceDetection
Please open Telegram to view this post
VIEW IN TELEGRAM
👍4❤2🔥1
This media is not supported in your browser
VIEW IN TELEGRAM
subtitles.vtt file'ni fetch qilib yangi o'zgaruvchi'ga saqlanadi. Qidirilgan keyword subtitle'dan ishlatilgan vaqti olinadi (e.g.,
00:00:10.500 -- 00:00:12.000). parseTime() orqali vaqt'ni string'dan date'ga o'tkaziladi va
video.play() orqali qo'yiladi.video.currentTime = matchedTime;
video.play();
P.s. Bekarchilkdan buyam bir eksperiment
Please open Telegram to view this post
VIEW IN TELEGRAM
🎉6👍3❤2
Navigator dasturchilarga foydalanuvchining veb-brauzeriga kirish va u bilan o‘zaro aloqada bo‘lish imkonini beradi, bu dasturchilarga website'ni yanada yaxshilashga yordam beradi
Masalan: Navigator obyektidan foydalangan holda foydalanuvchining brauzeri versiyasi, ekran o‘lchami, til sozlamalari va internet tezligini aniqlashi mumkin. Bu ma’lumotlar yordamida saytni yanada yaxshilash mumkin.
Navigator obyekti foydalanuvchining geografik joylashuvini aniqlashda ham ishlatilinadi. Bu til tarjimalari, valyuta konvertatsiyasi va mahalliy ob-havo ma’lumotlarini taqdim etishga imkon beradi.
Navigator Global Window Object'ni bir qismi hisoblanadi.
let navigatorObject = window.navigator;
Navigator object property orqali o'zimizga kerak bo'lgan ma'lumotlarni olishimiz mumkin
⚠️ 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.
navigator Object'ni console'ga chiqaradigan bo'lsak, hamma browser da ham bir xil ma'lumotni ko'rsatmaydi
Masalan: Chrome orqali deviceMemory aniqlash mumkin, lekin FireFox'da bu ma'lumot mavjud emas
Battery Charge Detecting
Navigator object orqali qurilma quvvatini (zaryadini) aniqlash uchun Battery Status API'dan foydalanamiz
navigator.getBattery() orqali Battery Status API'ga kiriladi va BatteryManager object'ni resolve qilish uchun Promise qaytaradi.BatteryManager Object
level, charging property'larni o'z ichiga oladi.level - qurilma quvvati (0 dan 1 gacha qiymatda)
charging - boolean qiymat qaytaradi, qurilma quvvat olyaptimi yuqmi aniqlash uchun
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.');
}🔗 bito.ai/resources/navigator-object-javascript-javascript-explained
#javascript #navigator
Please open Telegram to view this post
VIEW IN TELEGRAM
👍5❤2🔥1
Jasur - IT Blog
Photo
👍3❤2🎉2
Storage class'lar C++'da lifespan, scope va o'zgaruvchilarning xotira manzili'ni (storage location) aniqlash uchun yordam beradigan keyword'lar hisoblanadi.
Storage class'lar o'zgaruvchilar xotirada qanday saqlanishini, qancha vaqt davomida mavjud bo'lishini, va qayerda foydalanilishi mumkinligini boshqaradi.
C++'da 4 ta asosiy
storage class'lar mavjud mavjud:*
auto : Bu block yoki funksiyada e'lon qilingan local o'zgaruvchilar uchun default storage classes hisoblanadi. auto storage class-ga ega o'zgaruvchilar avtomatik saqlanadi. Masalan: Bironta block yoki funksiya bajarilishni (execute) boshlasa, ichkarida e'lon qilingan
auto o'zgaruvchilar xotiraga saqlanadi, va execute process (bajarilish jarayoni) tugagandan keyin xotiradan olib tashlanadi.Auto o'zgaruvchi e'lon qilish:
auto int a = 5;
Yoki default holat'da :
int a = 5;
C++'da O'zgaruvchilar default holatda auto bo'lgani uchun, auto keyword kam holatda ishlatilinadi.
*
register : Bu storage class compiler'ga o‘zgaruvchini protsessor'dagi (CPU) tezkor va kichik xotiraga saqlashni taklif qiladi. Ammo, hozirga compiler'lar bu so'rovni rad qilishi mumkin.Register o'zgaruvchi e'lon qilish:
register int counter = 5;
register storage class o'zgaruvchilari ham automatic xotiraga saqlash xususiyatiga ega.
*
static : Qachonki program execute bo'lishni boshlaganda static storage class ishlatilagan o'zgaruvchilar uchun xotiradan alohidan joy ajratiladi va program to'xtaguncha o'sha joyga saqlanadi.Masalan:
#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
*
extern : "extern" storage class boshqa fayllarda aniqlangan o‘zgaruvchilarni e’lon qilish uchun ishlatiladi. Bu o‘zgaruvchining butun dastur davomida ishlatish imkonini beradi. "extern" o‘zgaruvchilar global scopega ega bo‘ladi va odatda bir nechta fayllar orasida o‘zgaruvchilarni ulashish uchun ishlatiladi.Masalan: file1.cpp
#include <iostream>
using namespace std;
extern int counter;
void increment() {
counter++;
cout << "Counter: " << counter << endl;
}
file2.cpp
#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;
}
🔗 javatpoint.com/cpp-storage-classes
#cpp #storageClass
Please open Telegram to view this post
VIEW IN TELEGRAM
❤2👍2🎉1😇1
React 19 foydalanishga tayyor (stable) bo'libdi!
🔗 react.dev/blog/2024/12/05/react-19
Bundan oldin Aprel oyida beta versiyasi taqdim qilingan edi.
Asosiy o'zgarishlar haqida:
✅ vercel.com/blog/whats-new-in-react-19
✅ admiral-studios.com/blog/react-19-2024-update-will-next-js-lose-its-relevance-what-do-experts-say
#react
Please open Telegram to view this post
VIEW IN TELEGRAM
react.dev
React v19 – React
The library for web and native user interfaces
👍5❤3🔥2😇1
Biz ko'p foydalanadigan matn'ni nusxalash tugmasi (button) qanday qilinadi ?
Hozirgi yangi browser'larda matn'ni nusxalash uchun Asynchronous Clipboard API'dan foydalanish osonroq
Eski brauzerlarga ham qo'llab-quvvatlash kerak bo'lsa, boshqa yo'llardan foydalangan yaxshiroq, ammo u yo'l biroz murakkab
Asynchronous Clipboard API - clipboard buyruqlariga javob berish imkonini beradi. Masalan: matn'ni qirqib olish, nusqalash va matn'ni joylashtirish (cut, copy vs paste)
*Copy
Nusxalashdan oldin, browser Clipboard API'ni qo'llab-quvvatlaydimi yo'qmi tekshirish kerak
if (navigator && navigator.clipboard && navigator.clipboard.writeText) return 'true'
Matn'ni nusxalash uchun
navigator.clipboard.writeText("Selected Text");To'liq kod:
const copyToClipboard = str => {
if (navigator && navigator.clipboard)
return navigator.clipboard.writeText(str);
return Promise.reject('API is not available.');
};str - nusxalash kerak bo'lgan matn*Paste
Matn'ni
paste qilish uchun .readText() funksiyadan foydalanamiznavigator.clipboard.readText()
Matn'ni joylashtirish uchun, joylashtirmoqchi bo'lgan input yoki textarea'ga
navigator.clipboard.readText() Promise qaytargandan keyin .value qilib joylaymiz.Masalan:
navigator.clipboard
.readText()
.then(text=>{document.getElementById('outputText').value = text})
*Cut
Matn'ni qirqish uchun
.writeText() funksiya'dan foydalanamiznavigator.clipboard
.writeText(textToCut)
.then(() => { inputField.value = '' })
textToCut - matnTekshirish uchun: clipboard-operations.vercel.app
🔗 30secondsofcode.org/js/s/copy-text-to-clipboard/#the-asynchronous-clipboard-api
#javascript #clipboard
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥6❤4👍3