Concepts of Javascript:-

Isha Bharti
6 min readNov 20, 2020
  1. what is Javascript=JavaScript is the Programming Language for the Web.JavaScript is a text-based programming language used both on the client-side and server-side that allows you to make web pages interactive. Where HTML and CSS are languages that give structure and style to web pages, JavaScript gives web pages interactive elements that engage a user

2.HTML is the structure of your page — the headers, the body text, any images you want to include

  • CSS controls how that page looks (it’s what you’ll use to customize fonts, background colors, etc.)
  • JavaScript is the magic third element. Once you’ve created your structure (HTML) and your aesthetic vibe (CSS), JavaScript makes your site or project dynamic.

3. What is JavaScript Used For?

We covered this a bit in the intro, but here’s a quick list of the main things JavaScript is used for.

  • Adding interactivity to websites — yup, if you want a website to be more than a static page of text, you’ll need to do some JavaScripting
  • Developing mobile applications — JavaScript isn’t just for websites…it’s used to create those apps you have on your phone and tablet as well
  • Creating web browser-based games — Ever played a game directly from your web browser? JavaScript probably helped make that happen
  • Back end web development — yeah, JavaScript is MOSTLY used on the front end of things, but it’s a versatile enough scripting language to be used on back end infrastructure, too.

4.Difference between synchronous and asynchronous

Synchronous way: It waits for each operation to complete after that only it executes the next operation.
Asynchronous way: It never waits for each operation to complete, rather it executes all operations in the first only. The result of each operation will be handled once the result is available.

5.Is javascript synchronous or asynchronous

JavaScript is asynchronous, blocking, single-threaded language. That just means that only one operation can be in progress at a time.

6.What many types of data in javascript?

  1. Primitive data types = String, Number, Boolean.
  2. Composite data types=Object, Array,function.
  3. special data types = undefined ,Null
  • String=A string (or a text string) is a series of characters like “John Doe”.

Strings are written with quotes. You can use single or double quotes:

  • Numbers =JavaScript has only one type of numbers.

Numbers can be written with, or without decimals:

  • Boolean =Booleans can only have two values: true or false.
  • Object =JavaScript objects are written with curly braces {}.

Object properties are written as name: value pairs, separated by commas.

  • Array =JavaScript arrays are written with square brackets.

Array items are separated by commas.

  • undefined =JavaScript, a variable without a value, has the value undefined. The type is also undefined.Any variable can be emptied, by setting the value to undefined. The type will also be undefined.
  • Null=In JavaScript null is "nothing". It is supposed to be something that doesn't exist.

7.Difference between let, var, and const

  • var declarations are globally scoped or function scoped while let and const are block-scoped.
  • var variables can be updated and re-declared within its scope; let variables can be updated but not re-declared; const variables can neither be updated nor re-declared.
  • They are all hoisted to the top of their scope. But while var variables are initialized with undefined, let and const variables are not initialized.
  • While var and let can be declared without being initialized, const must be initialized during declaration.

8.Concept of this keyword

The JavaScript this keyword refers to the object it belongs to.

It has different values depending on where it is used:

  • In a method, this refers to the owner object.
  • Alone, this refers to the global object.
  • In a function, this refers to the global object.
  • In a function, in strict mode, this is undefined.
  • In an event, this refers to the element that received the event.
  • Methods like call(), and apply() can refer this to any object.

exapmle-

var person = {
firstName: “John”,
lastName: “Doe”,

fullName: function() {
return this.firstName + “ “ + this.lastName;
}
};
console.log(person.fullName())

it will give output -john Doe

var person = {
firstName : “John”,
lastName : “Doe”,
id : 5566,
myFunction : function() {
return this;
}
};
console.log(person.myFunction())

it will output :{ firstName: ‘John’,
lastName: ‘Doe’,
id: 5566,
myFunction: [Function] }

  • Beacuse we wrote here only this so eveytobject is coming.

9.What is the difference between == and === operators?

  • ==equal to
  • ===equal value and equal type

10. What is spread operator or rest operator?

  • Spread operator is commonly used to make shallow copies of js object.
  • It is concatenated between 2 array into single array.
  • example-
  • let arr1 = [“Annu”, “Isha” ];
  • let arr2 = [“polly”, …arr1];
  • console.log(arr2)
  • o/p :- [“polly”, “Annu”, “Isha”]

Rest operator

function testRest(x,y,…z){
console.log(x); // a
console.log(y); // b
console.log(z); // [c,d,e]
}

console.log(testRest(“a”,”b”,”c”,”d”));

In rest operator whatever we are writing in last it is coming in list in z cd willl come with list.

11. what is callback?

  • In JavaScript, a callback is a function passed into another function as an argument to be executed later.

12.Note-that JavaScript is a single-threaded programming language. It carries asynchronous operations via the callback queue and event loop.

13.single thread programming language?

=Single threaded processes contain the execution of instructions in a single sequence. In other words, one command is processes at a time.

The opposite of single threaded processes are multithreaded processes. These processes allow the execution of multiple parts of a program at the same time. These are lightweight processes available within the process.

14.Destructing of object

  • The destructuring assignment syntax is a JavaScript expression that makes it possible to unpack values from arrays, or properties from objects, into distinct variables.
  • let a, b, rest;
    [a, b] = [10, 20];
  • console.log(a);
    // expected output: 10
  • console.log(b);
    // expected output: 20
  • [a, b, …rest] = [10, 20, 30, 40, 50];
  • console.log(rest);
    // expected output: Array [30,40,50]
  • rest mean whatever is in left it will print.
const [a, ...b] = [1, 2, 3];
console.log(a); // 1
console.log(b); // [2, 3]

15.Map () Filter() Reduce()

Map

The map() method is used for creating a new array from an existing one, applying a function to each one of the elements of the first array.espically we are using map for loop.

const numbers = [1, 2, 3, 4];
const doubled = numbers.map(item => item * 2);
console.log(doubled); // [2, 4, 6, 8]
function root() {
var roots = agesArr.map(Math.sqrt);
return roots;
};root();//This will return: [ 5, 6, 7, 8, 9 ];
const name =["isha","polly","annu"];
console.log(name[0])
console.log(name[1])
console.log(name[2])
// or
const newarr=name.map(function(a,){
return a
});
console.log(newarr)
const name =["isha","polly","annu"];
console.log(name[0])
console.log(name[1])
console.log(name[2])
// or
const newarr=name.map(function(a,i){
return i+" :"+a
});
console.log(newarr)
I we are giving for indexing it will give inidex number as welll as
// var a=8;
// if (a>4){// console.log("correct")// }else{// console.log("not")// }const data= [{name: "isha" ,age:22,sex:"female"},{name:"Ashok",age:63,sex:"male"},{name:"annu",age:23,sex:"female"}];console.log(data[0].name)console.log(data[1].name)console.log(data[2].name)const new_data=data.map(function(a){return a.name}// in the place of name it will come name only we are writing function name then it will come all object);console.log(new_data)write in vs code and check it

Filter

The filter() method takes each element in an array and it applies a conditional statement against it. If this conditional returns true, the element gets pushed to the output array. If the condition returns false, the element does not get pushed to the output array.

Map and Filter the both are similar -

The syntax for filter is similar to map, except the callback function should return true to keep the element, or false otherwise. In the callback, only the element is required.

const numbers = [1, 2, 3, 4];
const evens = numbers.filter(item => item % 2 === 0);
console.log(evens); // [2, 4]

Reduce

The reduce() method reduces an array of values down to just one value. To get the output value, it runs a reducer function on each element of the array.

Es6:

In es6 we are using const in the placce of var

Array Destructuring in ES6 Javascript

The destructuring assignment syntax is a JavaScript expression that makes it possible to unpack values from arrays, or properties from objects, into distinct variables.

// Its for es5
// var a=[“css”,”python”,”webscrap”,”javascipt”];
// var first= a[0]
// var second= a[1]
// var third= a[2]
// var fourth= a[3]
// console.log(“my favourite programming language is “ + fourth)
// its for es6
// let [first,second,third,fourth]= a;
// console.log(“my favourite programming language is “ + fourth)
// if I want only and fourth
// let [first,,,fourth]= a;
// console.log(“my favourite programming language is “ + fourth)

Arrow function in es6 :its also called fat arrow function.

// like this we are writing in es5
var addi= function(){
var a=60;
var b=70;
return a+b;
}
console.log(addi())
// using fat arrow function in es6
var addict=()=>{
let a=5;
let b=10;
return a+b
}
console.log(addict())
// third way
const a=5;
const b=6;
var addic=()=>{return(a+b)};
console.log(addic())
// fourth way
var addiction=(a,b)=>{return(5+9)};
console.log(addiction())

--

--