Introduction With Basic JavaScript
The world’s most misunderstood programming language is JavaScript but JavaScript is now used by an incredible number of high-profile applications. So, it’s an important skill for any web or mobile developer to enrich the deeper knowledge in it.
Unlike most programming languages, the JavaScript language has no concept of input or output. It is designed to run as a scripting language in a host environment, and it is up to the host environment to provide mechanisms for communicating with the outside world.
Its syntax is based on the Java and C languages — many structures from those languages apply to JavaScript as well. JavaScript supports object-oriented programming with object prototypes, instead of classes. JavaScript also supports functional programming — because they are objects, functions may be stored in variables and passed around like any other object.
Let’s start off by looking at the building blocks of any language: the types. JavaScript programs manipulate values, and those values all belong to a type. JavaScript’s types are:
· Number
· String
· Boolean
· Function
· Object
· Symbol
and undefined and null, which are … slightly odd. And Array, which is a special kind of object. Date and RegExp, which are objects that you get for free. And to be technically accurate, functions are just a special type of object. So the type of diagram looks like this:
· Number
· String
· Boolean
· Function
· Symbol
· Object
· Function
· Array
· Date
· null
· undefine
And there are some built-in Error types as well. Things are a lot easier if we stick with the first diagram, however, so we'll discuss the types listed there for now.
(Here are just short descriptions and functionalities of javascript you have to learn them in detail.)
1. Numbers
Numbers in JavaScript are “double-precision 64-bit format IEEE 754 values”, according to the spec — There’s no such thing as an integer in JavaScript (except BigInt, BigInt is a built-in object that provides a way to represent whole numbers larger than 253 - 1, which is the largest number JavaScript can reliably represent with the Number primitive and represented by the Number.MAX_SAFE_INTEGER constant. BigInt can be used for arbitrarily large integers) so you have to be a little careful.)
Example:
console.log(5/2); // 2.5 not 2
console.log(Math.floor(5/2)); // 2
So an apparent integer is in fact implicitly a float.
Using parseInt() function we can convert string to integer & also use the unary +
operator to convert values to numbers
Example:
parseInt ( ‘213’ , 10 ); // 213
parseInt ( ‘010’ , 10 ); // 10
using unary operator:
+ ’ 50 ’; // 50
+ ‘ 100 ’; // 100
Using parseFloat() function we convert in float. And it always uses base 10.
A special value called NaN (short for "Not a Number") is returned if the string is non-numeric and NaN
is toxic. If you provide it as an operand to any mathematical operation, the result will also be tested for NaN
using the built-in isNaN() function.
Example:
parseInt( ‘Murad’ , 10); //NaN
NaN + 25; //NaN
isNan(NaN); // true
isNan(undefine); // false
Some Math function:
· Math.abs(): This
function returns the absolute value of a number.
· Math.ceil(): This the
function always rounds a number up to the next largest integer. Math.ceil(null)
returns integer 0 and does not give a NaN error.
· Math.floor(): This the
function returns the largest integer less than or equal to a given number.
· Math.min(): This
returns the lowest-valued number passed into it, or NaN if any parameter isn't a number and can't be converted into one.
· Math.max():
function returns the largest of the zero or more numbers given as input parameters.
· Math.random(): This
function returns a floating-point, pseudo-random number in the range 0 to less than 1 (inclusive of 0, but not 1) with approximately uniform distribution over that range — which you can then scale to your desired range.
· Math.round(): This
function returns the value of a number rounded to the nearest integer.
· Math.sqrt(): This
function returns the square root of a number
2. String
Strings in JavaScript are sequences of Unicode characters. More accurately, they are sequences of UTF-16 code units; each code unit is represented by a 16-bit number. Each Unicode character is represented by either 1 or 2 code units. Strings are useful for holding data that can be represented in text form.
Some of the most-used operations on strings are to check their length, to build and concatenate them using the + and += string operators. checking for the existence or location of substrings with the indexOf() method, or extracting substrings with the substring() method.
a. chaeAt(): To access an individual character in a string.
b. concat(): This method concatenates the string arguments to the calling and returns a new string.
c. includes(): This
method determines whether one string may be found within another string returning true or false.
d. endsWith(): This
method determines whether a string ends with the characters of a specified string, returning true
or false
as appropriate
e. indexOf(): This
method returns the index within the calling string object of the first occurrence of the specified value, starting the search at fromIndex
. Returns -1
if the value is not found.
f. lastIndexOf(): This
method returns the index within the calling string object of the last occurrence of the specified value, searching backwards from fromIndex
. Returns -1
if the value is not found.
g. replace(): This
method returns a new string with some or all matches of a pattern
replaced by a replacement
. The pattern
can be a string or a RegExp, and the replacement
can be a string or a function to be called for each match. If pattern
is a string, only the first occurrence will be replaced.
h. slice(): This
method extracts a section of a string and returns it as a new string, without modifying the original string.
i. split(): This
method divides a String into an ordered list of substrings, puts these substrings into an array, and returns the array. The division is done by searching for a pattern; where the pattern is provided as the first parameter in the method's call.
j. startsWith(): This
method determines whether a string begins with the characters of a specified string, returning true
or false
as appropriate.
k. substr(): This
method returns a portion of the string, starting at the specified index and extending for a given number of characters afterwards.
l. toLowerCase(): This
method returns the calling string value converted to lower case.
m. toUpperCase()
: This method returns the calling string value converted to uppercase (the value will be converted to a string if it isn't one).
n. trim(): This
method removes whitespace from both ends of a string. Whitespace in this context is all the whitespace characters (space, tab, no-break space, etc.) and all the line terminator characters.
o. trimStart():This
method removes whitespace from the beginning of a string. trimLeft()
is an alias of this method.
p. trimEnd(): This
method removes whitespace from the end of a string. trimRight()
is an alias of this method.
3. Boolean:
JavaScript has a boolean type, with possible values true
and false
. Any value can be converted to a boolean according to the following rules:
a. False: false, 0, empty strings (“ ”), NaN, null, and undefined
b. True: All other values become.
Example:
Boolean(‘ ’); //false
Boolean(123); //true
4. null:
JavaScript distinguishes between null, which is a value that indicates a deliberate non-value. Which is accessible through the null keyword.
5. undefined:
undefined, which is a value of type undefined that indicates an uninitialized variable — that is, a value hasn't even been assigned yet. This is actually a constant.
6. Variables:
variables in JavaScript are declared using one of three keywords:
a. let : let
allows you to declare block-level variables. The declared variable is available from the block it is enclosed in.
b. const : const allows you to declare variables whose values are never intended to change. The variable is available from the block it is declared in.
c. ver : var is the most common declarative keyword. It does not have the restrictions that the other two keywords have. This is because it was traditionally the only way to declare a variable in JavaScript. A variable declared with the var
keyword is available from the function it is declared in.
7. Objects
There are two basic ways to create an empty object:
var obj = new Object ();
var obj = {};
Object literal syntax can be used to initialize an object in its entirety:
var obj = {
name: ‘Carrot’,
_for: ‘Max’, // ‘for’ is a reserved word, use ‘_for’ instead.
details: {
color: ‘orange’,
size: 12
}
};
Attribute access can be chained together:
obj.details.color; // orange
obj[‘details’][‘size’]; // 12
8. Array
Arrays in JavaScript are actually a special type of object. They work very much like regular objects but they have one magic property called ‘length
'. This is always one more than the highest index in the array.
Example:
var a = [‘dog’, ‘cat’, ‘hen’];
a.length; // ourput: 3
Some basic function about array:
· concat(): method is used to merge two or more arrays. This method does not change the existing arrays, but instead returns a new array.
· every():
method tests whether all elements in the array pass the test implemented by the provided function. It returns a Boolean value.
· filter():
method creates a new array with all elements that pass the test implemented by the provided function.
· find(): method returns the value of the first element in the provided array that satisfies the provided testing function.
· findIndex(): method returns the index of the first element in the array that satisfies the provided testing function. Otherwise, it returns -1
, indicating that no element passed the test.
· forEach(): method executes a provided function once for each array element.
· indexOf(): method returns the first index at which a given element can be found in the array, or -1 if it is not present.
· join(): method creates and returns a new string by concatenating all of the elements in an array, separated by commas or a specified separator string. If the array has only one item, then that item will be returned without using the separator.
· map(): method creates a new array populated with the results of calling a provided function on every element in the calling array.
·
lastIndexOf(): ethod returns the last index at which a given element can be found in the array, or -1 if it is not present. The array is searched backwards, starting at fromIndex
· pop():
ethod removes the last element from an array and returns that element. This method changes the length of the array.
· push():method adds one or more elements to the end of an array and returns the new length of the array.
· reduce():method executes a reducer function (that you provide) on each element of the array, resulting in single output value.
· reverse():
method reverses an array in place. The first array element becomes the last, and the last array element becomes the first.
· shift(): method removes the first element from an array and returns that removed element. This method changes the length of the array
· slice():
method returns a shallow copy of a portion of an array into a new array object selected from start
to end
(end
not included) where start
and end
represent the index of items in that array. The original array will not be modified
· sort(): method sorts the elements of an array in place and returns the sorted array. The default sort order is ascending, built upon converting the elements into strings, then comparing their sequences of UTF-16 code units values.
· splice():
method changes the contents of an array by removing or replacing existing elements and/or adding new elements in place.
· unshift(): method adds one or more elements to the beginning of an array and returns the new length of the array.
9. Function:
Along with objects, functions are the core component in understanding JavaScript. The most basic function couldn’t be much simpler:
function add(x, y) {
var total = x + y;
return total;
}
add(); // NaN
// You can’t perform addition on undefined
add(2, 3, 4); // 5
// added the first two; 4 was ignored
10.Date
JavaScript Date
objects represent a single moment in time in a platform-independent format. Date
objects contain a Number
that represents milliseconds since 1 January 1970 UTC