0% found this document useful (0 votes)
10 views

Js

js basics

Uploaded by

ramagoddy
Copyright
© © All Rights Reserved
Available Formats
Download as PDF or read online on Scribd
0% found this document useful (0 votes)
10 views

Js

js basics

Uploaded by

ramagoddy
Copyright
© © All Rights Reserved
Available Formats
Download as PDF or read online on Scribd
You are on page 1/ 10
‘wraai24, 229 AM Projects | 100x005 Javascript 101 1of5 ritpssprojects.100xcovs.com/plfjavascript-1Wavaseript 101-1 10 ‘912824, 9:39 AM Projects | 100xDevs 5 https://x.com/__Raiders/status/1820089916287828123 = j, Jovascriptol tofS + 5044/status/1820090993045020979 Bounty = $25 to each of you! Javascript - The basics Web development Web development involves writing a lot of HTML, CSS and JS code. Historically (and even today to some extend), browsers could only understand HTML, CSS and JS Any website that you see, is a bunch of HTML, CSS and JS files along with some assets (images, videos etc) Facts/Callouts 1. React, NextJS are frameworks . They compile down to HTML, CSS, JS in the end. That is what your browser understands. 2. When you run your C++ code on leeteode , it does not run on your browser/machine. It runs somewhere else. Your browser can't (almost) htps:ifprojects.100xdevs.comipatjavascript1/Javascript-101-4 2110 ‘912824, 9:39 AM Projects | 100xDevs 3.l€ someone asks — What all languages can your browser interpret, the =}! Javascript 101 1ofs JS and WebAssembly. It can, technically, run v++*/RUST Code that is compiled down to Wasm Before we proceed, do one of the following - 1. Create an account on replit 2, Install Node,js locally 3. Keep your browser console open for testing locally Properties of JS Every language comes with it's unique set of features. Javascript has the following - 1. Interpreted JavaScript is an interpreted language, meaning it's executed line-by-line at runtime by the JavaScript engine in the browser or server environment, rather than being compiled into machine code beforehand. Upsides = unning your code Downsides = htps:ifprojects.100xdevs.comipatjavascript1/Javascript-101-4 30 ‘912824, 9:39 AM Projects | 100xDevs 1 Performance Overhead: =, Javascript 101 1of5 he errors 2. Dynamically Typed Variables in JavaScript are not bound to a specific data type. Types are determined at runtime and can change as the program executes C++ Code (won't compile) #include © int main() { int a =1; a = "hello"; a = true; } JS Code (will compile) a= true; console log(a) 3. Single threaded JavaScript executes code in a single-threaded environment, meaning it processes one task at a time. We will dive deeper into this next week. htps:ifprojects.100xdevs.comipatjavascript1/Javascript-101-4 ano ‘912824, 9:39 AM Projects | 100xDevs 4 Garhane collected = __ Javascript 101 1of . - — «eully Manages memory allocation and deallocation through garbage collection, which helps prevent memory leaks by automatically reclaiming memory used by objects no longer in use. Conclusion Is JS a good language? Yes and no. It is beginner friendly, but has a lot of performance overhead. Bun is trying to solve for a lot of this, but there’s a long way to go before JS can compete with languages like C++/Rust Syntax of Javascript 1. Variables Variables are used to store data. In JavaScript, you declare variables using var, let, OF const. let name = "John", // Variable that can be reassigned © const age = 30; —_// Constant variable that cannot be reassigned :clare variables, function-scoped Y Assignment htps:ifprojects.100xdevs.comipatjavascript1/Javascript-101-4 510 sw224, 999 AM Projects | 100:00re Create a variable for each of the following: your favorite color, your i€ Javascript 101 1ofs i, ANd whether you like pizza. Use appropriate valiuvre aeciuruuans (let, const, or var ). Try logging it using consolelog 2. Data types let number = 42; || Number © let string = "Hello World’; // String let isActive = false; —_// Boolean let numbers = [12,3]; // Array 3. Operators let sum = 10 + 5; // Arithmetic operator ® let isEqual = (10 === 10); // Comparison operator let isTrue = (true && false); // Logical operator 4. Functions || Function declaration © function greet(name) { return "Hello, " + name; } || Function call let message = greet("John’); // “Hello, John” V Assignment #1 Write a function sum that finds the sum of two numbers. Side quest - Try passing in a string instead of a number and see what happens? v Assignment #2 Write a function called canvote that returns true or false if the age of a htps:ifprojects.100xdevs.comipatjavascript1/Javascript-101-4 610 ‘912824, 9:39 AM Projects | 100xDevs 5. 1t/Else = Javascript 101 1of 5 console.log("You are an adult); yelse { console.log("You are a minor.’); } v Assignment Write an if/else statement that checks if a number is even or odd. If it's even, print "The number is even,’ Otherwise, print "The number is odd." 6. Loops |] For loop © for (let i = 0;i < 5; i++) { console.log(i); // Outputs 0 to 4 } 1] While loop let j = 0; while (j <5) { console.log(j); // Outputs 0 to 4 itt; } ¥ Assignment Write a function called sum that finds the sum from 1to a number htps:ifprojects.100xdevs.comipatjavascript1/Javascript-101-4 70 ‘912824, 9:39 AM Projects | 100xDevs 7mnlev types = Javascript 101 1of5 Objects An object in JavaScript is a collection of key-value pairs , where each key is a string and each value can be any valid JavaScript data type, including another object. console.log("Harkirats age is " + user.age); Vv Assignment #1 Write a function that takes a user as an input and greets them with their name and age Vv Assignment #2 Write a function that takes a new object as input which has name , age and gender and greets the user with their gender (Hi Mr/Mrs/others harkirat, your age is 21) v Assignment #3 Also tell the user if they are legal to vote or not Arrays Arrays let you group data together const tatalUsers = users.length; htps:ifprojects.100xdevs.comipatjavascript1/Javascript-101-4 ano sw224, 999 AM Projects | 100:00re const firstUser = users[0]; =, Javascript 101 ofS Write a function that takes an array of numbers as input, and returns a new array with only even values. Read about filter in JS Array of Objects We can have more complex objects, for example an array of objects const users = [{ © name: ‘Harkirat, const userl = users[0] const userlAge = users[0].age Vv Assignment Write a function that takes an array of users as inputs and returns only the users who are more than 18 years old Object of Objects We can have an even more complex object (object of objects) const userl = { © name: ‘harkirat’, age:19, address: { city: "Delhi", country: "India". htps:ifprojects.100xdevs.comipatjavascript1/Javascript-101-4 eno ‘112824, 9:39 AM Projects | 100x005 } E ¢ davascript 0 1018 3.5 city: Y Assignment Create a function that takes an array of objects as input, and returns the users whose age > 18 and are male ntps:ifprojects.100xdevs.comipatjavasctipt-1/Javascrip-101-1 s0110

You might also like