Today I explored some important JavaScript and React concepts that help in writing better and more predictable code. ** Scope System in JavaScript I learned how variables are accessed in different scopes and how JavaScript manages them. • Lexical Scope – A function can access variables from its parent scope. • Variable Shadowing – When a variable inside a function has the same name as a variable outside it. • Block Scope – Variables declared with let and const are limited to the block where they are defined. ** Updating State in React I also learned the difference between primitive values and reference values when working with useState. • Primitive values (number, string, boolean) can be updated directly. • Objects and Arrays should be updated by creating a new copy instead of modifying the original state. Example: setUser({ ...user, age: 22 }); Understanding how scope, state updates, and data structures work makes React applications more reliable and easier to maintain. Every day of learning is helping me become more confident in building modern web applications. Looking forward to learning more and building exciting projects! @Sheryians Coding School @Sarthak Sharma @Ritik Rajput @Daneshwar Verma @Devendra Dhote #ReactJS #JavaScript #FullStackDeveloper #WebDevelopment #CodingJourney #LearnInPublic
JavaScript Scope System & React State Updates
More Relevant Posts
-
🚀 JavaScript Notes – Simplified & Powerful! 📌 Here are some quick and essential JavaScript points every beginner should know: ✨ What is JavaScript? • A programming language used to make web pages interactive • Works with HTML & CSS • Runs directly in the browser 💡 Variables • "var", "let", "const" • "let" → changeable • "const" → fixed value 🔢 Data Types • String, Number, Boolean • Null, Undefined • Object, Array ⚙️ Functions • Block of code to perform tasks • Improves reusability 🖱️ Events • Responds to user actions • Examples: click, submit, change 🌐 DOM (Document Object Model) • Helps interact with web page elements • Makes pages dynamic 🔥 Why Learn JavaScript? • Core of web development • High demand skill • Opens doors to frontend & backend 💬 Keep learning. Keep building. Stay consistent. #JavaScript #WebDevelopment #Coding #Programming #StudentLife #LearnToCode #TechSkills
To view or add a comment, sign in
-
-
🚀 JavaScript Coding Challenge for Developers I’ve been sharpening my DSA and JavaScript problem-solving skills, and here’s a fun challenge I recently worked on 👇 💡 Problem: Find the Largest Nested Array You are given an array that may contain numbers and nested arrays. Your task is to find the nested array with the maximum number of elements. 👉 If multiple arrays have the same length, return the first one found 🧾 Example Input: [1, [2, 3], [4, 5, 6], [7], 8, [9, 10, 11, 12]] Output: [9, 10, 11, 12] ⚡ Key Learnings ✔ Handling mixed data types (numbers + arrays) ✔ Using Array.isArray() effectively ✔ Comparing based on .length instead of values ✔ Writing clean and efficient iteration logic 🔗 Check out my solution here: https://lnkd.in/grVEgZiW 🧠 Challenge for You Can you solve this if: 👉 The array is nested multiple levels deep? 👉 (Hint: Recursion 🔥) 💬 Drop your approach in the comments — let’s learn together! #JavaScript #CodingChallenge #DSA #WebDevelopment #Frontend #ReactJS #Developers #100DaysOfCode
To view or add a comment, sign in
-
-
🚀 Day 1 – JavaScript Journey with Rohit Negi Today I started learning JavaScript from scratch and explored not just “what it is” but why and how it works behind the scenes 💻 📌 1. What is JavaScript? JavaScript is a programming language used to make websites interactive. Without JS, websites would be static (no buttons, animations, or dynamic content). 📌 2. Client-Server Interaction & Browser Role 🌐 Client (Browser) sends request Server sends response Browser renders HTML/CSS JavaScript runs inside browser to handle logic and interaction 📌 3. Why a New Language? 🤔 Web needed a language that could run directly in the browser without heavy setup. 📌 4. Reasons behind JavaScript creation: ✔️ Ease of Learning – Simple syntax, beginner friendly ✔️ Security Limitations 🔐 – Runs inside browser sandbox (safe environment) ✔️ Lightweight ⚡ – Designed for systems with limited resources ✔️ Automatic Garbage Collection ♻️ – Memory automatically managed 📌 5. How JavaScript Runs (V8 Engine) In Chrome, JavaScript runs using the V8 Engine, which converts JS code into fast machine code. 📌 6. Other JavaScript Engines Firefox uses SpiderMonkey Different browsers have their own engines but same JS logic 📌 7. What is V8 Engine? Written in C++ Compiles JavaScript directly into machine code (not interpreted only) Makes execution super fast 🚀 📌 8. Running JavaScript Outside Browser JavaScript is not limited to browsers. We can run it on our system using Node.js 📌 9. Installing & Running Node.js Installed Node.js Ran JS files using VS Code terminal 📌 10. Magic of Node.js ✨ Node.js allows: Backend development Server creation File handling Real-world applications 🔥 Quick Recap: JavaScript = Easy + Secure + Fast + Powerful 💡 Learning Insight: Understanding “how things work internally” is more important than just coding. 💪 End of Day 1 – Strong Foundation Built! Excited for Day 2 🚀 #Day1 #JavaScript #NodeJS #WebDevelopment #CodingJourney #LearnToCode #Developers #RohitNegi 💻🔥
To view or add a comment, sign in
-
-
Most developers learn JavaScript… but struggle when it comes to arrays in real projects. And the truth is — Arrays are used everywhere. So I created a JavaScript Array CheatSheet that makes everything simple and practical. Inside this guide: ⚡ Add elements → push() / unshift() ⚡ Remove elements → pop() / shift() ⚡ Check existence → includes() ⚡ Find index → indexOf() ⚡ Iterate arrays → forEach() / map() ⚡ Find elements → find() Each concept is explained with: ✔ Clean code examples ✔ Real outputs ✔ Easy-to-understand logic Perfect for: ✅ Beginners learning JavaScript ✅ Frontend developers ✅ Interview preparation ✅ Quick revision before coding 💡 If you master arrays, you unlock 80% of JavaScript logic building. 📌 Save this post — you’ll need it again. 💬 Comment “JS” and I’ll share the full cheat sheet. Follow for more JavaScript tips, roadmaps, and developer content. #JavaScript #FrontendDevelopment #WebDevelopment #JS #CodingTips #LearnJavaScript #Programming #Developers #SoftwareEngineering #CodingLife #DeveloperCommunity #SurajSingh
To view or add a comment, sign in
-
🚀 Day 67 of My Coding Journey Today I focused on understanding the fundamentals of JavaScript — what it is, how it works, and why it is essential in web development. 📚 What is JavaScript? JavaScript is a high-level, interpreted programming language used to make web pages interactive and dynamic. 🔹 It runs directly in the browser 🔹 It is one of the core technologies of the web (along with HTML & CSS) 🔹 It is widely used for both frontend and backend development ⚙️ How JavaScript Works: 💡 1. Execution in Browser JavaScript runs inside the browser using a JavaScript Engine (like V8 in Chrome). 💡 2. Single-Threaded Language JavaScript executes code line by line (synchronously) but can handle async tasks. 💻 Topics I Revised: ✅ Variables (var, let, const) ✅ Data Types (Primitive & Non-Primitive) ✅ Operators (Arithmetic, Comparison, Logical) ✅ Conditional Statements ✅ Loops (for, while, do-while) 💡 Key Learnings: ✨ JavaScript is the brain of a website ✨ Understanding how JS works internally is very important ✨ Concepts like event loop & async behavior are crucial ✨ Strong basics = better problem-solving skills #Day67 #JavaScript #CodingJourney #WebDevelopment #LearnInPublic #100DaysOfCode #FrontendDevelopment #10000Coders
To view or add a comment, sign in
-
🚀 JavaScript Roadmap: Zero to Hero (12 Weeks) Still confused where to start in programming? Start with JavaScript — the backbone of the web 🌐 I’ve created a simple 12-week roadmap to help students and beginners become job-ready step by step. 📌 What you will learn: ✔ Web Basics (HTML, CSS, JS) ✔ DOM & Events ✔ Modern JavaScript (ES6+) ✔ Frontend (React) ✔ Backend (Node.js) ✔ Database (MongoDB / MySQL) ✔ Full Stack Development ✔ Real Projects & Job Preparation - Beginners with zero coding knowledge - Anyone who wants to build real projects 🔥 Golden Rule: Learn → Build → Fail → Improve → Repeat Don’t just watch tutorials ❌ Start building today ✔ 📍 Sri Pathrakali Digital Solutions, Kalugumalai 🌐 www.goldenwebportal.com #JavaScript #WebDevelopment #Programming #FullStackDeveloper #Coding #Students #CareerGrowth #LearnToCode #GoldenWebPortal #IndiaTech
To view or add a comment, sign in
-
-
Day 11 of documenting my journey as a Front-End Developer — Introduction to JavaScript Today, I started learning JavaScript, and I had a big misconception at first—I thought JavaScript was an advanced version of Java. I learned that this is not true. JavaScript and Java are completely different languages. JavaScript was created by Brendan Eich and was originally called Mocha, then LiveScript, before being renamed JavaScript to attract Java developers. JavaScript is a high-level, interpreted programming language mainly used to make websites interactive. One thing that stood out to me is how JavaScript executes code—line by line (synchronously), meaning order matters. I also learned: . JavaScript files are saved as .js (e.g., app.js) . It is linked in HTML using: HTML <script src="app.js"></script> . The defer attribute is used when the script is placed in the <head> to delay execution until the HTML loads Interesting fact: Different browsers use different JavaScript engines: . Chrome ---V8 Engine . Firefox----- SpiderMonkey On comments I understood: . JavaScript uses // for single-line comments . /* */ can also be used (same as CSS) . But HTML comments (<!-- -->) do not work in JavaScript Lesson learned: Understanding the foundation of a language helps clear wrong assumptions before diving deeper. #FrontendDevelopment #JavaScript #WebDevelopment #LearningJourney #BeginnerMistakes #WomenInTech #softwareengineering #developer #learninginpublic #techcommunity #careergrowth
To view or add a comment, sign in
-
-
💡 Understanding Scope in JavaScript One of the most important concepts in JavaScript is Scope. Scope defines where variables can be accessed in your code. There are three main types of scope in JavaScript: 🔹 Global Scope Variables declared outside any function are accessible anywhere in the program. let name = "Muneeb"; function showName() { console.log(name); } showName(); // Accessible because it's global 🔹 Function Scope Variables declared inside a function can only be used inside that function. function greet() { let message = "Hello"; console.log(message); } greet(); // console.log(message); ❌ Error 🔹 Block Scope Variables declared with "let" and "const" inside "{ }" are only accessible within that block. if (true) { let age = 25; console.log(age); } // console.log(age); ❌ Error 📌 Understanding scope helps developers write cleaner code and avoid bugs related to variable access. Mastering these fundamentals makes JavaScript much easier to understand and improves problem-solving skills. #JavaScript #WebDevelopment #FrontendDeveloper #Coding #LearnToCode
To view or add a comment, sign in
-
Frontend Learning — Understanding Event Loop in JavaScript JavaScript is single-threaded, but still handles async tasks like APIs, timers, and promises smoothly — thanks to the Event Loop. -> So how does it actually work? 1️⃣ Call Stack – Executes synchronous code line by line 2️⃣ Web APIs – Handles async tasks (setTimeout, fetch, etc.) 3️⃣ Callback Queue – Stores callbacks from async operations 4️⃣ Microtask Queue – Stores promises (.then, catch) 5️⃣ Event Loop – Decides what runs next -> Execution Priority: First → Call Stack Then → Microtasks (Promises) Then → Macrotasks (setTimeout, setInterval) -> Why this matters: Understanding this helps you debug async issues, optimize performance, and write predictable code. -> Key Takeaway: Promises always execute before setTimeout (even with 0 delay). #JavaScript #FrontendDevelopment #WebDevelopment #AsyncJavaScript #EventLoop #CodingTips #LearnInPublic #DeveloperJourney
To view or add a comment, sign in
-
Explore related topics
Explore content categories
- Career
- Productivity
- Finance
- Soft Skills & Emotional Intelligence
- Project Management
- Education
- Technology
- Leadership
- Ecommerce
- User Experience
- Recruitment & HR
- Customer Experience
- Real Estate
- Marketing
- Sales
- Retail & Merchandising
- Science
- Supply Chain Management
- Future Of Work
- Consulting
- Writing
- Economics
- Artificial Intelligence
- Employee Experience
- Workplace Trends
- Fundraising
- Networking
- Corporate Social Responsibility
- Negotiation
- Communication
- Engineering
- Hospitality & Tourism
- Business Strategy
- Change Management
- Organizational Culture
- Design
- Innovation
- Event Planning
- Training & Development