У цій статті
Navishcho vykorystovuvaty onlajn JavaScript-plejgraund?
Onlajn JavaScript-plejgraund dozvolyaye pysaty ta zapuskaty kod JavaScript bezposeredno u vashomy brauzeri bez zhodnoho nalashtuvannya. Ne potribno stvoryuvaty proekt, vstanovlyuvaty Node.js chy nalashtouvaty instrument zbirky. Vy pyshet kod, natyskayete Zapustyty ta bachyte rezultat negajno. Tse idealno dlya shvydkykh eksperymentiv, vyvchennya novykh API ta vidladky izoliovanoyi logiky.
Plejgraundy osoblyvo korysni, koly vy khochete protestuvaty nevelyku ideyu pered yiyi vprovadzhennyam u realnyj proekt. Zamist dodavannya console.log do vashoho zastokunka, peremykannya na terminal ta perezapusku dev-servera, vy mozhete pereviryty svoyu lohiku za kilka sekund v izoliovanomu seredovyshchi.
Yak pratsyuye sandbox
Plejgraund vykonuye vash kod u izoliovanomu iframe, vidokremlenomu vid holovnoyi storinky. Tsya arkhitektura zabezpechuye bezpeku ta chyste seredovyshche vykonannya.
- Izolyatsiya iframe -- vash kod pratsyuye v okremomu konteksti perehlyadannya bez dostupu do storinky-khosta, cookie abo localStorage holovnoho zastosunka
- Zakhoplennya konsoli -- vyklyky console.log, console.error, console.warn ta console.table perekhopljuyutsya ta vidobrazhauyutsya v paneli vyvodu zamist DevTools brauzera
- Obrobka pomylok -- pomylky vykonannya ta syntaksychni pomylky zakhopljuyutsya ta vidobrazhauyutsya z trasuyvannyam steku, shchob vy mohly vidladzhuvaty bez vidkryttya DevTools
Спробуйте безкоштовно — реєстрація не потрібна
Vidkryty JavaScript-plejgraund →Shcho vy mozhete robyty
Plejgraund pidtrymuye povnu movu JavaScript, yak yiyi realizovano vashym brauzernykh rukhivkom, vklyuchayuchy suchasni funktsii ES2024.
- Testuvaty alhorytmy ta struktury danykh -- realizujte sortuvannya, poshuk chy okhid dereva ta perevirte pravilnist z prykladamy vvodu
- Vyvchaty JavaScript API -- eksperymentujte z metodamy Array, lantsyuzhkamy Promise, paternamy async/await, Map, Set ta inshymy vbudovanymy ob'yektamy
- Prototypuvaty lohiku -- pyshit utilitni funktsii, transformatsiyi danykh abo parsery ta testujte yikh pered intehratsiyeyu u vash kodovyj bazi
- Vidladzhuvaty paterni regex -- testujte rehuliyarni vyrazy na prykladovykh ryadkakh ta inspektujte hrupy zbihiv interaktyvno
Chasto zadavani zapytannya
Chy bezpechno zapuskaty kod u plejgraundi?
Tak. Kod vykonuyetsya v izoliovanomu iframe z obmezhenymy dozvolamy. Vin ne mozhe otrymaty dostup do batkivskoyi storinky, robyty kros-oryginni zapyty poza standartnymy pravylamy brauzera chy chytaty vashi fajly. Sandbox ekvivalentnyj vidkryttyuyu porzhnoyi HTML-storinky ta zapusku kodu v yiyi konsoli.
Chy pidtrymuye vin async/await ta Promises?
Tak. Plejgraund povnistyu pidtrymuye async/await, Promises, setTimeout, setInterval ta inshi asynkhronni paterni. Vyvedennya konsoli vid asynkhronnykh operatsij z'yavlyayetsya v paneli vyvodu u miru yikh zavershennnya. Vy mozhete vykorystovuvaty top-level await dlya napysannya asynkhronnoho kodu bez yoho ohortannya u funktsiyu.
Chy mozhna vykorystovuvaty API brauzera, taki yak fetch chy manipulyatsiyu DOM?
Vy mozhete vykorystovuvaty fetch dlya HTTP-zapytiv z urakhuvannyam pravyl CORS. Manipulyatsiya DOM pratsyuye v mezhakh sandbox iframe, ale za zamovchuvannyam nemaye vydymoho HTML-dokumenta. Plejgraund rozroblenyj dlya testuvannya logiky ta vyvodu konsoli, a ne vizualnoho renderynhu DOM.
Yaki obmezhennya porivnyano z Node.js?
Plejgraund pratsyuye v brauzeri, a ne v Node.js. Vy ne mozhete vykorystovuvaty spetsyfichni dlya Node moduli, taki yak fs, path abo http. Vy takozh ne mozhete vstanovlyuvaty pakety npm. Prote vsi standartni JavaScript API, dostupni v brauzerakh, pratsyuyut, vklyuchayuchy fetch, crypto.subtle, structuredClone ta suchasni funktsii ES2024.