A JavaScript function is a block of code designed to perform a particular task. function is executed when "something" invokes it (calls it).
A JavaScript function is defined with the function keyword, followed by a name, followed by parentheses ().
Function parameters are listed inside the parentheses () in the function definition. Function arguments are the values received by the function when it is invoked. Inside the function, the arguments (the parameters) behave as local variables.
When JavaScript reaches a return statement, the function will stop executing. If the function was invoked from a statement, JavaScript will "return" to execute the code after the invoking statement. Functions often compute a return value. The return value is "returned" back to the "caller".
The () operator invokes (calls) the function. Accessing a function without () returns the function and not the function result.
An object literal is a list of name:value pairs inside curly braces {}.
You can access object properties in two ways -
objectName.propertyName, objectName["propertyName"]Objects are containers for Properties and Methods. Properties are named Values. Methods are Functions stored as Properties. Properties can be primitive values, functions, or even other objects. Objects are objects, Maths are objects, Functions are objects, Dates are objects, Arrays are objects, Maps are objects, Sets are objects. All JavaScript values, except primitives, are objects.
A primitive value is a value that has no properties or methods. 3.14 is a primitive value. A primitive data type is data that has a primitive value. JavaScript defines 7 types of primitive data types -
A) string
B) number
C) boolean
D) null
E) undefined
F) symbol
G) bigintPrimitive values are immutable (they are hardcoded and cannot be changed).
Objects are mutable. They are addressed by reference, not by value.
An Object is an Unordered Collection of Properties. Properties are the most important part of JavaScript objects. Properties can be changed, added, deleted, and some are read only.
The delete keyword deletes a property from an object. The delete keyword deletes both the value of the property and the property itself.
Accessing Object Method- objectName.methodName()
Adding a new method to an object -
person.name = function () {
return this.firstName + " " + this.lastName;
};toUpperCase()
method to convert a text to uppercase.Some solutions to display JavaScript objects are -
Displaying the Object Properties by name, Displaying the Object
Properties in a Loop, Displaying the Object using Object.values(),
Displaying the Object using JSON.stringify()Object For In Loop -
const person = {
name: "John",
age: 30,
city: "New York"
};
let text = "";
for (let x in person) {
text += person[x] + " ";
};
document.getElementById("demo").innerHTML = text;You must use person[x] in the loop. person.x will not work (Because
x is the loop variable).Object.values()
creates an array from the property values.
Example - Object.values(person)Object.entries()
makes it simple to use objects in loops.JavaScript objects can be converted to a string with JSON method
JSON.stringify()
.To create an object type we use an
object constructor function
.
function Person(first, last, age, eye) {
this.firstName = first;
this.lastName = last;
this.age = age;
this.eyeColor = eye;
}
const myFather = new Person("John", "Doe", 50, "blue");
const myMother = new Person("Sally", "Rally", 48, "green");
myMother.changeName = function (name) {
this.lastName = name;
}
myMother.changeName("Doe");
document.getElementById("demo").innerHTML =
"My mother's last name is " + myMother.lastName;
This is Example!HTML events are "things" that happen to HTML elements. When
JavaScript is used in HTML pages, JavaScript can "react" on these
events. Here are some examples of HTML events -
An HTML web page has finished loading, An HTML input field was
changed, An HTML button was clicked. Common HTML Events -
onchange - An HTML element has been changed
onclick - The user clicks an HTML element
onmouseover - The user moves the mouse over an HTML element
onmouseout - The user moves the mouse away from an HTML element
onkeydown - The user pushes a keyboard key
onload - The browser has finished loading the page
Strings
Strings are for storing text. Strings are written with
quotes.Template Strings were introduced with ES6 (JavaScript
2016). Templates are strings enclosed in backticks (This is a
). Templates allow single and double quotes inside a
template string
string. Templates are not supported in Internet Explorer.To find the length of a string, use the built-in
length
property.The backslash escape character () turns special characters
into string characters.let text = "We are the so-called \"Vikings\" from the north."; let text= 'It\'s alright.';
JavaScript Strings as Objects -
let y = new String("John");
Do not create Strings objects. The new keyword complicates the code and slows down execution speed. String objects can produce unexpected results
Comparing two JavaScript objects always returns false.
Basic String Methods -
- String length - The length property returns the length of a string.
- String charAt() - The charAt() method returns the character at a specified index (position) in a string.
- String charCodeAt() - The charCodeAt() method returns the code of the character at a specified index in a string. The method returns a UTF-16 code (an integer between 0 and 65535).
- String at()
- String [ ]
- String slice()
- String substring()
- String substr()
- String toUpperCase()
- String toLowerCase()
- String concat()
- String trim()
- String trimStart()
- String trimEnd()
- String padStart()
- String padEnd()
- String repeat()
- String replace()
- String replaceAll()
- String split()
String Search Methods -
- String indexOf()
- String lastIndexOf()
- String search()
- String match()
- String matchAll()
- String includes()
- String startsWith()
- String endsWith()
Template Strings use back-ticks (``) rather than the quotes ("") to define a string.
Top comments (0)