Scribd
Upload
14 views41 pages

Unit - 3 JavaScript

JavaScript is a lightweight, interpreted client-side scripting language primarily used for creating interactive web pages. Developed in 1995, it is distinct from Java and supports dynamic typing, object-oriented programming, and event handling. The document also covers JavaScript syntax, variable declaration, and the use of tokens, keywords, identifiers, literals, and operators.

Uploaded by

ravi sgt
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF or read online on Scribd
14 views41 pages

Unit - 3 JavaScript

JavaScript is a lightweight, interpreted client-side scripting language primarily used for creating interactive web pages. Developed in 1995, it is distinct from Java and supports dynamic typing, object-oriented programming, and event handling. The document also covers JavaScript syntax, variable declaration, and the use of tokens, keywords, identifiers, literals, and operators.

Uploaded by

ravi sgt
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF or read online on Scribd
BCA - INTERNET PROGRAMMING UNIT -3 JavaScripts Introduction : JavaScript is most commonly used as a client side scripting language. This means that JavaScript code is written into an HTML page. When a user requests an HTML page with JavaScript in it, the script is sent to the browser and it's up to the browser to do something with it JavaScript has nothing to do with Java. JavaScript and Java are completely different languages, both in concept and design. JavaScript programs are run by an interpreter built into the user’s web browser (not on the server). Itis lightweight interpreted programming language and most commonly used as a part of web pages, whose implementations allow client-side script to interact with the user and make dynamic pages. JavaScript is a very free-form language compared to Java. Definition: Java Script is a dynamic scripting computer programming language used to make web pages interactive in HTML pages History : JavaScript was developed by Brendan Ei h in 1995 at Netscape Corporation (LiveSeript). The technology was first called Mocha, then Live Script. Eventually it was named JavaScript to follow the marketing of another programming language called Java Java was developed by Sun Microsystems and is a completely different programming language and technology JavaScript was a competitive technology to VBScript, a Microsoft product. While VBScript worked only on the Internet Explorer browser, JavaScript was supported on other browsers, too, ‘Grade Calege Fi BCA - INTERNET PROGRAMMING ‘© This made JavaScript a preferred language for global applications. © ECMA-262 is the official name. ECMA Script 6 (released in June 2015) is the latest JavaScript version. Advantages Of JavaScript The advantages of using JavaScript are + Lightweight Scripting Language: Designed primarily for client-side web development, it's efficient and optimized for browser execution + Interpreted Language: It doesn't require compilation before execution, allowing for faster development cycles + Dynamic Typing: Variables are dynamically typed, meaning their data type is determined at runtime based on the assigned value. + Object-Oriented Programming (OOP) Support: While prototype-based, it supports OOP concepts like objects, classes (introduced in ES6), inheritance, and polymorphism + First-Class Functions: Functions are treated as regular values, meaning they can be assigned to variables, passed as arguments, and returned from other functions «Event Handling: It excels at responding to user interactions and other events in real- , enabling interactive web experiences. = Control Statements: Includes standard control. flow structures like if- else, switch, for, while, and do-while loops + Built-in Data Structures: Provides native support for arrays, sets, maps, and other data structures. + Garbage Collection: Automatic memory management handles deallocation of objects that are no longer referenced, + Cross-Platform Support: Runs on various operating systems and browsers, making it suitable for web, mobile, and desktop applications * Rich Ecosystem: Supported by a vast collection of libraries and frameworks (e.g., React, Angular, [Link], Node,js) that accelerate development and expand its capabilities. Browser Compatibility: JavaScript is widely supported. It is available in the following browsers: © Netscape Navigator Me: Guruprasad TR Ast Profesor, Dept of BCA, C ‘Grade Calege 2 BCA - INTERNET PROGRAMMING Microsoft Internet Explorer Firefox Safari Opera Google Chrome Java Script syntax JavaScript can be implemented using JavaScript statements that are placed within the tags, containing your JavaScript, anywhere within you web page, but it is normally recommended that you should keep it within the tags. The Placing JavaScript JavaScript code can be inserted into anywhere in an HTML document by using the SCRIPT tag. We can have any number of scripts. To include JavaScript in an HTML file are as follows: 1. Script in ... section. 2. Script in ... section 3. Script in ... and ... sections. 4. Script in an external file and then include in ... section. ‘Mes Guruprasad TR, Asst Professor, Dept of BCA, Chaitanya First Grade College 3 BCA - INTERNET PROGRAMMING 1 JavaScript in ... Section : : If you want to have a script run on some event, such as when a user clicks somewhere, then you will place that script in the head as follows, a fle_Eét_Farmat View Help “chead> input (ype~"button’ onclick~"sayHelloO" valie="Clicke me" > Me. Guruprasad TR, Ast Professor, Dep. of BCA, Chaitanya Fist Grade College BCA - INTERNET PROGRAMMING This code will produce the following results: ©) CAUsers\SANDesktop\ O ~ C || GS cAUsers\SANDesktop... @D ~ Safety~ Tooky @~ = Message from webpage Ay Wtehen scion JavaScript in External File We are not restricted to be maintaining identical code in multiple HTML files. The script tag provides a mechanism to allows to store JavaScript in an external file and then include it into your HTML files. Here is an example to show how we can include an external JavaScript file in your HTML code using script tag and its sre attribute. To use JavaScript from an external file source, you need to write all your JavaScript source code in a simple text file with the extension " js" and then include that file as shown above For example, you can keep the following content in filename,js file and then you can use sayHello function in your HTML file after including the filename,js file Function sayHello() { alert("Hello World") 3 Tokens Of JavaScript : Tokens are the smallest individual words, phrases, or characters that JavaScript can understand. When JavaScript is interpreted, the browser parses the script into these tokens while ignoring comments and white space. JavaScript tokens fit in five categories Mes Guruprasad TR, Asst Professor, Dept of BCA, Chaitanya First Grade College < BCA - INTERNET PROGRAMMING + Keywords + Identifiers + Literals © Operators © Separators. Keywords: + Keywords are predefined identifiers that make up the core of a programming language. In JavaScript, they perform unique functions such as declaring new variables and functions, making decisions based on the present state of the computer, or starting a repetitive loop inside your application. Keywords, which are built into JavaScript, are always available for use by the programmer but must follow the correct syntax. + Keywords cannot be used to name identifiers Here is the list of keywords available in JavaScript. await break case catch class const debugger default delete do else enum, export extends false finally for function if implements import in instanceof interface let new null package private protected public return super switeh stat this throw try true typeof var void while with yield Identifiers: In JavaScript, an identifier is a sequence of characters used to name variables, functions, parameters, classes, properties and other entities in the code These names must follow specific rules: * It consists of alphabets(a-z,A-Z), numbers(0-9) and special symbol underscore(_) and dollar($) © An identifier must begin with a letter (A-Z, a-z), an underscore (_), or a dollar gn (8). It cannot start with a digit. After the first character, identifiers can contain letters (A-Z, a-z), digits (0-9), ‘Mes Guruprasad TR, Asst Professor, Dept of BCA, Chaitanya First Grade College 7 BCA - INTERNET PROGRAMMING underscores (_), and dollar signs ($) © JavaScript identifiers are case-sensitive, This means that myVariable and My Variable are treated as two different identifiers * Identifiers cannot be JavaScript reserved keywords. These are words that have special meaning in the language, such as function, if, for, const, let, var, return, etc Example : _internalData, Sprice, userName123, Y2K Literals: In JavaScript, literals are constant values that are assigned to variables. The literals are also known as constants. There are different types of literals in JavaScript. They are listed below a. Integer Literal An integer literal represents a numerical value (either positive or negative integer). There should not be any blank space or separators within the integer literal. An integer literal can be represented in different ways: + Octal (base 8) + Decimal (base 10) + Hexadecimal (base 16) + Binary (base 2) Example: 56 (decimal), 022 (octal), OxFF (Hexadecimal), 100101 (binary) b. Floating point Literal Floating point literals represent floating point values. They have three parts: integral part, decimal point and fractional part. Floating point literals can be represented only in decimal form and scientific form Example: 6.627642, 80854E-12 ¢. Char Literal A character literal can be represented in one of the following methods 1. Single quotes : The character literals can be specified within a single quote. Example: char c= *h’ 2. Escape sequence : The escape sequences start with a backslash (\), Example: char ch = “\? 3. Integral value An integer value can be used as a character literal. The integer value represents the Unicode value of the character. Example: char ch = 96 Unicode : The Unicode representation of the character literal is done in the following format: ‘\uXXXX’ where XXXX represent a hexadecimal number. Example: char ch="\u1234° d. String Literal A string literal is a series of characters which are specified within double quotes ‘Grade Calege * BCA - INTERNET PROGRAMMING Example: string str="Hello World” e. Boolean Literal A Boolean literal can take only two values i.e. either True or False Example: bool b= False f. Array Literal An array literal consists of a list of values of the same type. These values are enclosed in a square bracket. Example: fruits = [“Orange”, “Mango”, “Banana” g. Object Literal The objects are created using object literals. The object literals contain property names and their values, Operators: These are symbols or keywords that perform operations on values or variables. Examples include: + Arithmetic operators: +, -, + Assignment operators: + Comparison operators: ==, ===, !=, + Logical operators: &&, || Punetu tors (or Separators): These are symbols used to structure the code, group elements, or separate statements. Examples include: + Parentheses: () © Curly braces: {} + Square brackets: [] = Comma: , + Semicolon: ; = Dot Comments: These are non-executable parts of the code used for documentation and ignored by the interpreter. They can be single-line (// comment) or multi-line (/* comment */) Whitespace: Spaces, tabs, and newlines that improve readability but are generally ignored by the interpreter unless they are part of a string literal Variables in JavaScript ‘Grade Calege ° BCA - INTERNET PROGRAMMING A variable is like a container that holds data that can be reused or updated later in the program. In JavaScript, variables are declared using the keywords var, let, or const. + var Keyword: This is the older way to declare variables. var declarations are function-scoped and can be re-declared and re-assigned within their scope. var greeting = "Hello"; greeting = "Hi", // Re-assign var greeting = "Hey"; // Re-declare (though generally discouraged) + let Keyword: Introduced in ES6 (ECMAScript 2015), let declarations are block- scoped and can be re-assigned but not re-declared within the same scope. let count = 10; count = 20; // Re-assign let count = 30; // Error: Cannot re-declare block-scoped variable + const Keyword : Also introduced in ES6, const declares a constant variable that cannot be re-assigned after its initial declaration. It is also block-scoped. const PI = 3.14; PI = 3.14159, // Error: Assignment to constant variable JavaScript Variable Scope The scope of a variable is the region of your program in which it is defined JavaScript variables have only two scopes. © Global Variables: A global variable has global scope which means it can be defined anywhere in your JavaScript code. © Local Variables: A local variable will be visible only within a function where defined. Funetion parameters are always local to that funetion. Within the body of a function, a local variable takes precedence over a global variable with the same name. If you declare a local variable or function parameter with the same name as a global variable, you effectively hide the global variable. The following example. JavaScript Output Statement In JavaScript, to display output, there are 4 simple and different ways and these are given below. We can use them according to the application requirements JavaScript display output in different way such as: ‘Grade Calege rn BCA - INTERNET PROGRAMMING © Using innerHTML, writing output into an HTML element + Using [Link](), writing output into an HTML element. + Using [Link](), writing and display output into alert box. ‘+ Using [Link](), writing output into browser developer console. 1. [Link]() [Link]() prints messages in your browser's. Developer Console (F12 or Cmd+Option+) and is used for general debugging to view values, objects, arrays, errors. This is quite versatile and can display numbers, strings, arrays, objects, and more. 3. [Link]() The document. write() method allows you to write content, including HTML, directly into the HTML document stream as the page is being loaded by the browser. In JavaScript the document object refers. to the HTML webpage, so the [Link]() method is used to write anything on the HTML webpage. Operator : Definition : An Operator is a symbol that tells to perform specific operation. Let us take a simple expression 5 + 3 is equal to 8, Here 5 and 3 are called operands and “+ is called the operator Types of Operator JavaScript supports the following types of operators. 1. Arithmetic Operators 2. Comparison Operators 3. Logical (or Relational) Operators 4, Bitwise Operator 5. Assignment Operators 6. Conditional (or ternary) Operators 1. Arithmetic Operators 7 BCA - INTERNET PROGRAMMING Arithmetic operators are used to perform arithmetic operations on the operands. Here is a list of operators that are known as JavaScript arithmetic operators Operator Description Example + __ [Adds two operands 10+ 20=30 = Subtracts the second operand from the first [30-20 = 10 7 [Divide the numerator by the denominator [20/10 = [Multiply two operands 5 *5=25 ‘% [Outputs the remainder of an integer division [20% 10 = 0 ++ [Increases an integer value by one — [Decreases an integer value by one Now a= 19 Note: Addition operator (+) works for Numeric as well as Strings. eg, “a” + 5 will give gs Example

Set the variables to different values and then try...

This code will produce the following results: =o x QD © Dariiensiioeep\ 0 - eG ervsessatdeton. Tatoos ies Set the variables to different values and then try... as 2. Comparison Operators ‘* The comparison operators in JavaScript compare two variables or values and return a boolean value, either true or false based on comparison result. © The comparison operators are used in logical expressions. A logical expression is ‘Mes Guruprasad TR, Asst Professor, Dept of BCA, Chaitanya First Grade College 7 BCA - INTERNET PROGRAMMING evaluated to either true or false. ‘© The comparison operators are binary operators as they perform operations on two operands. The operands can be numerical, string, logical, or object values. ‘* There are eight comparison operators in JavaScript to perform different types of comparison Operator | Description Example Equal I= Not Equal Strict equality (equal value and equal type) Strict inequali equal type) (not equal value or not > Greater than x>y < Less than x=y <= | Less than or Equal to x <=y 3. Logical Operators: ‘© The logical operators in JavaScript are generally used with Boolean operands and return a boolean value, ‘+ There are mainly three types on logical operators in JavaScript - && (AND), || (OR), and | (NOT), These operators are used to control the flow the program. The logical operators are typically used with Boolean values, they can be used with any type. ‘© For each non-boolean value, the operator converts to a boolean. The falsy values are converted to false and ¢ruthy values to true. © There are six falsy values in JavaScript: false, null, undefined, 0 (zero), "" (empty string), NaN. © The value other than falsy values are treated as sruthy values. So non zero numbers, non-empty strings, ete., are éruthy values In the below table, we have given the logical operators with its description and example. Lets assume: x rue, y = false Operator |Description Example && — Logical AND (x && y) is false Mr uruprasad T Ry Asst. Pres Dept of BCA, Chaitanya First Grade College 5 BCA - INTERNET PROGRAMMING Il Logical OR (x |] y) is true. ! |Logical NOT (x) is false. 4. Bitwise Operato ‘* The bitwise operators in JavaScript perform operations on the integer values at the binary level. They are used to manipulate each bit of the integer values. Bitwise operators are similar to logical operators but they work on individual bits ‘© JavaScript bitwise operators works on 32-bits operands. In JavaScript, numbers are stored as 64-bit floating point number. JavaScript converts the numbers to 32-bit signed integer before performing the operation. After bitwise operation, it converts the result to 64-bits number. ‘* There are seven bitwise operators in JavaScript * Following is the list of bitwise operators with description Operator Name Description & — |Bitwise AND Returns 1 if both bits are 1, otherwise 0, | |Bitwise OR Returns 1 if either bit is 1, otherwise 0. Returns 1 if both bits are different, eS otherwise 0 Bitwise NOT Returns 1 if bit is 0, otherwise 0. Shifts the bits left by pushing zeros in << |Left Shift from right and discarding leftmost bits Shifts the bits right by pushing copies of| >> |Right Shift leftmost bit in from left and discarding rightmost bits. Shifts the bits right by pushing zeros in from left and discarding rightmost bits. Following is the truth table for bitwise AND, bitwise OR, bitwise XOR operation — >>> |Right Shift with Zero A B A&B| A|B | ASB 0 0 0 0 0 0 1 0 1 1 1 0 0 1 1 1 1 1 1 0 ‘Grade Calege ra BCA - INTERNET PROGRAMMING The bitwise NOT (~) operator performs the NOT operation on each bit of the binary number. It is a unary operator that inverts each bit of the binary number and returns the 2s complement to the binary number. Following is the truth table for the wise XOR operation Input (A) [Output (~A) 0 1 i 0 5. Assignment Operator ‘© The assignment operators in JavaScript are used to assign values to the variables These are binary operators, ‘© An assignment operator takes two operands, assigns a value to the left operand based on the value of right operand ‘* The /eff operand is always a variable and the right operand may be literal, variable or expression. ‘© An assignment operator first evaluates the expression and then assign the value to the variable (left operand) Variable = value; An assignment operator first evaluates the expression and then assigns the value to the variable (left operand). An arithmetic assignment operator performs arithmetic operation and assign the result to a variable. Following is the list of operators with example ~ Assignment Operator Example | Equivalent To = (Assignment) a=b += (Addition Assignment) at=b Subtraction Assignment) *b Multiplication Assignment) /= (Division Assignment) afb la=a/b %b b A bitwise assignment operator performs bitwise operation on the operands and assigns the ‘%= (Remainder Assignment) “*= (Exponentiation Assignment) [a "*=b result to a variable. Following is the list of operators with example ~ Assignment Operator Example | Equivalent To ‘Grade Calege 7

You might also like