Difference between revisions of "JavaScript/C2/Overview-of-JavaScript/English"

From Script | Spoken-Tutorial
Jump to: navigation, search
(Created page with "1")
 
Line 1: Line 1:
−
1
+
'''Title of the script: '''JavaScript Overview
 +
 
 +
'''Author:''' Jayesh Katta Ramalingaiah
 +
 
 +
'''Domain Reviewer: '''
 +
 
 +
'''Novice Reviewer:'''
 +
 
 +
'''Keywords: '''JavaScript, ECMAScript, JS, ES6
 +
 
 +
 
 +
 
 +
{| border=1
 +
|  <center>'''Visual Cue'''</center>
 +
|  <center>'''Narration'''</center>
 +
 
 +
|-
 +
|  Slide: Title
 +
|  Hello and welcome to the Spoken Tutorial on “Overview of '''JavaScript'''”.
 +
 
 +
|-
 +
|  Slide:
 +
 
 +
Learning Objectives
 +
|  In this tutorial we will learn:
 +
 
 +
* Why '''JavaScript?'''
 +
* About '''JavaScript'''
 +
* The content available in various tutorials in this series.
 +
 
 +
|-
 +
| Slide: Prerequisites for using '''JavaScript'''
 +
|  To work with '''JavaScript,''' we need-
 +
 
 +
* A '''text editor, '''in which to write and understand the '''JavaScript code '''and
 +
* A '''web browser'''.
 +
 
 +
|-
 +
| Slide 4: '''For the recording of the JavaScript series'''
 +
|  Throughout this series I will be using:
 +
 
 +
* '''Ubuntu Linux''' OS version 18.04
 +
* '''Visual Studio Code''' version 1.45.0 ('''code editor''')
 +
* '''Firefox''' web browser
 +
 
 +
|-
 +
|  Slide: '''JavaScript'''
 +
|  '''JavaScript''' is a living language, which is constantly evolving with new features.
 +
 
 +
Today, '''JavaScript '''is very popular because we can develop
 +
 
 +
* Web applications
 +
* Mobile applications (windows, android and IOS)
 +
* Desktop applications,
 +
* Virtual Reality applications and
 +
* Do a lot more with this language.
 +
 
 +
|-
 +
|  Slide: Why '''JavaScript?'''
 +
|  Let’s go back 25 years and understand how this language evolved.
 +
 
 +
Apart from '''Internet Explorer''', '''Netscape Navigator''' was the only available '''browser''' in the early 90s.
 +
 
 +
'''Browsers''' were supporting only static content with '''HTML '''and '''CSS'''.
 +
 
 +
Everyone was using the '''web''' to just read information like how we read newspapers.
 +
 
 +
There was no support for actions in the '''browser'''.
 +
 
 +
So to make the '''web''' and '''browser''' better, '''JavaScript '''was introduced.
 +
 
 +
Using '''JavaScript''', users were able to interact more on the '''web'''.
 +
 
 +
|-
 +
|  '''Slide: ECMAScript'''
 +
|  '''ECMAScript '''is a standard for '''scripting languages''' such as '''JavaScript, JScript''', etc.
 +
 
 +
It is a trademark '''scripting language''' specification.
 +
 
 +
'''ECMAScript '''ensures the interoperability of '''web pages''' across different '''web browsers'''.
 +
 
 +
Until 2015, there were no proper '''JavaScript '''new feature release cycles.
 +
 
 +
In 2015, massive features were introduced, which were released as '''ECMAScript 6 '''popularly called '''ES6'''.
 +
 
 +
From then, every year new features were added and released every year as '''ES7, ES8, ES9'''… and so on.
 +
 
 +
In this tutorial series, we would be covering '''ES6 '''and above '''language standards'''.
 +
 
 +
|-
 +
| 
 +
|  Now, we will briefly go through some of the individual tutorials in this series.
 +
 
 +
|-
 +
|  Glimpse of How to use JS in HTML
 +
|  In this tutorial, we will learn how to write '''JS code''' for an '''HTML '''file.
 +
 
 +
|-
 +
|  Glimpse of Data Types and Variables in JS
 +
|  In the next tutorial, we will learn about different '''data types''' available in '''JS.'''
 +
 
 +
|-
 +
|  Glimpse of Operators in JS
 +
|  In this tutorial, We will learn about the different types of '''operators.'''
 +
 
 +
Such as arithmetic, logical, relational and other available operators in '''JS.'''
 +
 
 +
|-
 +
|  Glimpse of Loops in JS
 +
|  In the '''Loops '''tutorial, we will learn about the standard '''loops '''and their '''syntax''' in '''JS.'''
 +
 
 +
|-
 +
|  Glimpse of Functions in JS
 +
|  In the next tutorial, we will learn about the different types of '''functions''', their '''syntax''' and usage in '''JS.'''
 +
 
 +
|-
 +
|  Glimpse of Window and DOM Manipulations in JS
 +
|  In this tutorial, we will learn about the '''window object'''.
 +
 
 +
We will also learn how to manipulate '''DOM '''elements with the help of the '''window object.'''
 +
 
 +
|-
 +
|  Glimpse of Events and Event Listeners in JS
 +
|  In this tutorial, we will learn about '''Events.'''
 +
 
 +
We will also understand the usage of '''event listeners''' on '''HTML '''elements.
 +
 
 +
|-
 +
|  Glimpse of Variable Keywords and Hoisting in JS
 +
|  In this tutorial, we will learn about the different types of '''variable keywords''' available in '''JS'''.
 +
 
 +
And, learn about their '''scopes '''and '''hoisting''' in '''JS'''.
 +
 
 +
|-
 +
|  Glimpse of Closure in JS
 +
|  In this tutorial, we will learn about the '''closure scope.'''
 +
 
 +
We’ll learn how to see the '''closure scope''' values in the '''function''' and their usage with examples.
 +
 
 +
|-
 +
|  Glimpse of Object and Array Destructuring in JS
 +
|  This tutorial will teach us about '''objects''' and '''array destructing''' in '''JS.'''
 +
 
 +
Along with that, we will be covering '''template literals''' and usage of the '''spread operator.'''
 +
 
 +
|-
 +
|  Glimpse of this keyword in JS
 +
|  The next tutorial will teach us about '''this keyword''' and their different types of '''bindings''' in detail.
 +
 
 +
|-
 +
|  Glimpse of Arrow Function in JS
 +
|  In this tutorial, we will learn about '''Arrow function''' with an example.
 +
 
 +
Then, we will learn more examples to understand the usage of '''setTimeout '''and '''setInterval.'''
 +
 
 +
|-
 +
|  Glimpse of Array Methods in JS
 +
|  In this tutorial, we will be walking through some of the basic methods for manipulating the '''array'''.
 +
 
 +
And, we will even look into some of the advanced '''array loops''' like '''forEach''', '''map '''and '''filter.'''
 +
 
 +
|-
 +
|  Glimpse of Classes and Inheritance in JS
 +
|  This tutorial teaches about '''class''', '''constructor''', '''super keyword''' and '''inheritance '''in '''JS '''with examples.
 +
 
 +
|-
 +
|  Glimpse of Promise and Async-Await in JS
 +
|  In this tutorial, we will learn about '''Promise''' and the different states of a '''promise'''.
 +
 
 +
Also, we’ll learn how to use a '''promise '''and its advantages.
 +
 
 +
Then we’ll see how to chain '''promise '''and how to handle multiple '''promise execution''' with '''async-await.'''
 +
 
 +
|-
 +
|  Glimpse of Fetch API in JS
 +
|  In this tutorial, we will learn how to fetch real-time '''GitHub user data'''.
 +
 
 +
We will learn this with a sample '''GitHub URL''' and display in the '''browser'''.
 +
 
 +
|-
 +
|  Glimpse of Project GitHb Repos in JS
 +
|  In this tutorial, we will learn how to take the '''input''' from the '''user'''.
 +
 
 +
And, then it will fetch the '''repo details''' of the '''GitHub user''' for the entered '''user input'''.
 +
 
 +
|-
 +
|  Only narration
 +
|  With this, we come to the end of this tutorial.
 +
 
 +
Let us summarise.
 +
 
 +
|-
 +
|  Slide: Summary
 +
|  In this tutorial, we have learnt about:
 +
 
 +
* Why '''JavaScript'''
 +
* '''ECMAScript '''and
 +
* The content available in various tutorials in this series
 +
 
 +
|-
 +
| Slide: About Spoken Tutorial Project
 +
|
 +
* The video at the following link summarises the Spoken Tutorial project.
 +
* Please download and watch it
 +
 
 +
|-
 +
| Slide: Spoken tutorial workshops
 +
|
 +
* We conduct workshops using spoken tutorials and give certificates.
 +
* For more details, please write to us.
 +
 
 +
|-
 +
| Slide: Answers for THIS Spoken Tutorial
 +
|
 +
* Do you have questions in THIS Spoken Tutorial?
 +
* Please visit this site.
 +
* Choose the minute and second where you have the question.
 +
* Explain your question briefly.
 +
* The Spoken Tutorial project will ensure an answer.
 +
* You will have to register to ask questions.
 +
 
 +
|-
 +
| Slide : Forum for specific questions
 +
|
 +
* The Spoken Tutorial forum is for specific questions on this tutorial.
 +
* Please do not post unrelated and general questions on them.
 +
* This will help reduce the clutter.
 +
* With less clutter, we can use these discussions as instructional material.
 +
 
 +
 
 +
 
 +
|-
 +
| Slide: Acknowledgement
 +
| Spoken Tutorial Project is funded by Ministry of Education (MoE), Government of India.
 +
 
 +
|-
 +
| Slide: Thanks
 +
| The script for this tutorial is contributed by Jayesh.
 +
 
 +
And this is Praveen signing off.
 +
 
 +
Thank you for joining.
 +
 
 +
|}

Revision as of 16:31, 23 July 2021

Title of the script: JavaScript Overview

Author: Jayesh Katta Ramalingaiah

Domain Reviewer:

Novice Reviewer:

Keywords: JavaScript, ECMAScript, JS, ES6


Visual Cue
Narration
Slide: Title Hello and welcome to the Spoken Tutorial on “Overview of JavaScript”.
Slide:

Learning Objectives

In this tutorial we will learn:
  • Why JavaScript?
  • About JavaScript
  • The content available in various tutorials in this series.
Slide: Prerequisites for using JavaScript To work with JavaScript, we need-
  • A text editor, in which to write and understand the JavaScript code and
  • A web browser.
Slide 4: For the recording of the JavaScript series Throughout this series I will be using:
  • Ubuntu Linux OS version 18.04
  • Visual Studio Code version 1.45.0 (code editor)
  • Firefox web browser
Slide: JavaScript JavaScript is a living language, which is constantly evolving with new features.

Today, JavaScript is very popular because we can develop

  • Web applications
  • Mobile applications (windows, android and IOS)
  • Desktop applications,
  • Virtual Reality applications and
  • Do a lot more with this language.
Slide: Why JavaScript? Let’s go back 25 years and understand how this language evolved.

Apart from Internet Explorer, Netscape Navigator was the only available browser in the early 90s.

Browsers were supporting only static content with HTML and CSS.

Everyone was using the web to just read information like how we read newspapers.

There was no support for actions in the browser.

So to make the web and browser better, JavaScript was introduced.

Using JavaScript, users were able to interact more on the web.

Slide: ECMAScript ECMAScript is a standard for scripting languages such as JavaScript, JScript, etc.

It is a trademark scripting language specification.

ECMAScript ensures the interoperability of web pages across different web browsers.

Until 2015, there were no proper JavaScript new feature release cycles.

In 2015, massive features were introduced, which were released as ECMAScript 6 popularly called ES6.

From then, every year new features were added and released every year as ES7, ES8, ES9… and so on.

In this tutorial series, we would be covering ES6 and above language standards.

Now, we will briefly go through some of the individual tutorials in this series.
Glimpse of How to use JS in HTML In this tutorial, we will learn how to write JS code for an HTML file.
Glimpse of Data Types and Variables in JS In the next tutorial, we will learn about different data types available in JS.
Glimpse of Operators in JS In this tutorial, We will learn about the different types of operators.

Such as arithmetic, logical, relational and other available operators in JS.

Glimpse of Loops in JS In the Loops tutorial, we will learn about the standard loops and their syntax in JS.
Glimpse of Functions in JS In the next tutorial, we will learn about the different types of functions, their syntax and usage in JS.
Glimpse of Window and DOM Manipulations in JS In this tutorial, we will learn about the window object.

We will also learn how to manipulate DOM elements with the help of the window object.

Glimpse of Events and Event Listeners in JS In this tutorial, we will learn about Events.

We will also understand the usage of event listeners on HTML elements.

Glimpse of Variable Keywords and Hoisting in JS In this tutorial, we will learn about the different types of variable keywords available in JS.

And, learn about their scopes and hoisting in JS.

Glimpse of Closure in JS In this tutorial, we will learn about the closure scope.

We’ll learn how to see the closure scope values in the function and their usage with examples.

Glimpse of Object and Array Destructuring in JS This tutorial will teach us about objects and array destructing in JS.

Along with that, we will be covering template literals and usage of the spread operator.

Glimpse of this keyword in JS The next tutorial will teach us about this keyword and their different types of bindings in detail.
Glimpse of Arrow Function in JS In this tutorial, we will learn about Arrow function with an example.

Then, we will learn more examples to understand the usage of setTimeout and setInterval.

Glimpse of Array Methods in JS In this tutorial, we will be walking through some of the basic methods for manipulating the array.

And, we will even look into some of the advanced array loops like forEach, map and filter.

Glimpse of Classes and Inheritance in JS This tutorial teaches about class, constructor, super keyword and inheritance in JS with examples.
Glimpse of Promise and Async-Await in JS In this tutorial, we will learn about Promise and the different states of a promise.

Also, we’ll learn how to use a promise and its advantages.

Then we’ll see how to chain promise and how to handle multiple promise execution with async-await.

Glimpse of Fetch API in JS In this tutorial, we will learn how to fetch real-time GitHub user data.

We will learn this with a sample GitHub URL and display in the browser.

Glimpse of Project GitHb Repos in JS In this tutorial, we will learn how to take the input from the user.

And, then it will fetch the repo details of the GitHub user for the entered user input.

Only narration With this, we come to the end of this tutorial.

Let us summarise.

Slide: Summary In this tutorial, we have learnt about:
  • Why JavaScript
  • ECMAScript and
  • The content available in various tutorials in this series
Slide: About Spoken Tutorial Project
  • The video at the following link summarises the Spoken Tutorial project.
  • Please download and watch it
Slide: Spoken tutorial workshops
  • We conduct workshops using spoken tutorials and give certificates.
  • For more details, please write to us.
Slide: Answers for THIS Spoken Tutorial
  • Do you have questions in THIS Spoken Tutorial?
  • Please visit this site.
  • Choose the minute and second where you have the question.
  • Explain your question briefly.
  • The Spoken Tutorial project will ensure an answer.
  • You will have to register to ask questions.
Slide : Forum for specific questions
  • The Spoken Tutorial forum is for specific questions on this tutorial.
  • Please do not post unrelated and general questions on them.
  • This will help reduce the clutter.
  • With less clutter, we can use these discussions as instructional material.


Slide: Acknowledgement Spoken Tutorial Project is funded by Ministry of Education (MoE), Government of India.
Slide: Thanks The script for this tutorial is contributed by Jayesh.

And this is Praveen signing off.

Thank you for joining.

Contributors and Content Editors

Nancyvarkey, Pravin1389

Retrieved from "https://script.spoken-tutorial.org/index.php?title=JavaScript/C2/Overview-of-JavaScript/English&oldid=55415"