KEMBAR78
JavaScript : A trending scripting language | PPTX
JavaScript
“A simple way to get more.”
Abhay Dhupar
abhaydhupar123@gmail.com
What is JavaScript ?
• JavaScript is one of the most popular and widely used programming language in the world
right now.
• It’s growing faster than other programming languages and big companies like Netflix,
Walmart and Paypal build their entire applications around JavaScript.
•
• US offers 75000 dollars per annum to JavaScript developers on an average.
• You can work as a -
Front-end
Developer
Back-end
Developer
Full-stack
Developer
What can you do with JavaScript ?
• For a long time, JavaScript was only used in browsers to build interactive web pages.
• Some developers referred to JavaScript as a toy language, but those days are gone because
of huge community support and investments like large companies like facebook and google.
• These days you can build -
Web / Mobile
Apps
Command-line
Tools
Real-time
Networking
Apps
Games
Where does JavaScript code run ?
• JavaScript was originally designed to run only in browsers. So every browser has JavaScript
Engine that can run JavaScript code. In Chrome, this engine is v8.
• In 2009, a very clever engineer called Ryan Dahl took the open source JavaScript Engine in
Chrome and embedded it in a C++ program. He called that program Node.
• So Node is a C++ program which includes Google’s v8 JavaScript Engine. Now with this, we
can run our JavaScript code outside of a browser. So we can pass our JavaScript code to
node for execution. So with JavaScript, we can build the backend for our web and our
mobile applications.
• Browser and Node provide a runtime environment for our JavaScript code.
Let’s see JavaScript in action.
Editor and Other requirements
• In order to write JavaScript code, you’ll need a code edit a code editor
• Following are some of the commonly used -
VS Code Sublime Atom
Download Node
• Technically, you don’t need Node on your machine for learning JavaScript, as you can do in
browser as well.
• But it is good to have Node in your machine to install third party libraries.
JS through web browser
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>Hello Abhay</h1>
<script>
console.log("Hello World") //Output(in your browser) inspect -> console
</script>
</body>
</html>
Separation of Concerns
• Now while we can easily write JavaScript code in between the script element. In a real-world
application, you have thousands or even million lines of code.
• We don't want to write all that code inline here we want to extract and separate our
JavaScript code from our HTML code.
• Let’s understand by a metaphor - Think of your house. In your bedroom, you have your bed
and your clothes.
• You don’t store your clothes in the kitchen. This is what we call separation of concerns.
• We have the same principle in programming, so we want to separate HTML which is all
about content from JavaScript which is all about behavior.
Cont…
JS through Node
• Open your .js file location.
• Open up cmd or terminal at same location.
• Now write node file_name.js
• Use Integrated terminal in VS Code.
Variables
• We use variables to store data temporarily.
• Use var keyword to declare a variable.
• There are issues with var, we can also use let
• Ex - var my_name = 'Abhay';
console.log(my_name);
Rules
• It cannot be a reserved word.
• It cannot be start with a number.
• It cannot contain a space or hyphen (–). We can either use CamelNotation.
• It is case sensitive.
What type of value can we store ?
JavaScript : A Dynamic Language
Object
• Object is a real world entity.
• For example – instead of giving name, age of a person; we can create a person object.
• Ex -
let person = {
name: 'Abhay',
age: 30
};
// dot notation
person.name = 'John';
// Bracket notation
person['name'] = 'Mary';
console.log(person);
Arrays
• Array in JS is also a object.
• Sometimes in your application, you need to deal with list of objects.
• So to store that list of objects, we need arrays.
• Since JS is dynamic so size and data type in array can change in run time.
• Ex – list of product, list of students.
let array = ['Abhay','CSE']
array[2] = 1
console.log(array)
console.log(array.length)
console.log(typeof(array));
Functions
• Functions are one of the fundamental building blocks in JS.
• Functions are used to perform a task.
• function keyword is used to declare a function.
function greet(fname, lname) {
console.log('Hello '+ fname + ' ' + lname)
}
greet('Abhay','Dhupar');

JavaScript : A trending scripting language

  • 1.
    JavaScript “A simple wayto get more.” Abhay Dhupar abhaydhupar123@gmail.com
  • 2.
    What is JavaScript? • JavaScript is one of the most popular and widely used programming language in the world right now. • It’s growing faster than other programming languages and big companies like Netflix, Walmart and Paypal build their entire applications around JavaScript. • • US offers 75000 dollars per annum to JavaScript developers on an average. • You can work as a - Front-end Developer Back-end Developer Full-stack Developer
  • 3.
    What can youdo with JavaScript ? • For a long time, JavaScript was only used in browsers to build interactive web pages. • Some developers referred to JavaScript as a toy language, but those days are gone because of huge community support and investments like large companies like facebook and google. • These days you can build - Web / Mobile Apps Command-line Tools Real-time Networking Apps Games
  • 4.
    Where does JavaScriptcode run ? • JavaScript was originally designed to run only in browsers. So every browser has JavaScript Engine that can run JavaScript code. In Chrome, this engine is v8. • In 2009, a very clever engineer called Ryan Dahl took the open source JavaScript Engine in Chrome and embedded it in a C++ program. He called that program Node. • So Node is a C++ program which includes Google’s v8 JavaScript Engine. Now with this, we can run our JavaScript code outside of a browser. So we can pass our JavaScript code to node for execution. So with JavaScript, we can build the backend for our web and our mobile applications. • Browser and Node provide a runtime environment for our JavaScript code.
  • 5.
  • 6.
    Editor and Otherrequirements • In order to write JavaScript code, you’ll need a code edit a code editor • Following are some of the commonly used - VS Code Sublime Atom
  • 7.
    Download Node • Technically,you don’t need Node on your machine for learning JavaScript, as you can do in browser as well. • But it is good to have Node in your machine to install third party libraries.
  • 8.
    JS through webbrowser <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <h1>Hello Abhay</h1> <script> console.log("Hello World") //Output(in your browser) inspect -> console </script> </body> </html>
  • 9.
    Separation of Concerns •Now while we can easily write JavaScript code in between the script element. In a real-world application, you have thousands or even million lines of code. • We don't want to write all that code inline here we want to extract and separate our JavaScript code from our HTML code. • Let’s understand by a metaphor - Think of your house. In your bedroom, you have your bed and your clothes. • You don’t store your clothes in the kitchen. This is what we call separation of concerns. • We have the same principle in programming, so we want to separate HTML which is all about content from JavaScript which is all about behavior.
  • 10.
  • 11.
    JS through Node •Open your .js file location. • Open up cmd or terminal at same location. • Now write node file_name.js • Use Integrated terminal in VS Code.
  • 12.
    Variables • We usevariables to store data temporarily. • Use var keyword to declare a variable. • There are issues with var, we can also use let • Ex - var my_name = 'Abhay'; console.log(my_name); Rules • It cannot be a reserved word. • It cannot be start with a number. • It cannot contain a space or hyphen (–). We can either use CamelNotation. • It is case sensitive.
  • 13.
    What type ofvalue can we store ?
  • 14.
    JavaScript : ADynamic Language
  • 15.
    Object • Object isa real world entity. • For example – instead of giving name, age of a person; we can create a person object. • Ex - let person = { name: 'Abhay', age: 30 }; // dot notation person.name = 'John'; // Bracket notation person['name'] = 'Mary'; console.log(person);
  • 16.
    Arrays • Array inJS is also a object. • Sometimes in your application, you need to deal with list of objects. • So to store that list of objects, we need arrays. • Since JS is dynamic so size and data type in array can change in run time. • Ex – list of product, list of students. let array = ['Abhay','CSE'] array[2] = 1 console.log(array) console.log(array.length) console.log(typeof(array));
  • 17.
    Functions • Functions areone of the fundamental building blocks in JS. • Functions are used to perform a task. • function keyword is used to declare a function. function greet(fname, lname) { console.log('Hello '+ fname + ' ' + lname) } greet('Abhay','Dhupar');