Scribd
Upload
2 views12 pages

Class 22 JavaScript - Variables & Mini Project

The document provides an overview of variables, including their definition, syntax rules, naming conventions, and methods for updating values. It emphasizes the importance of using appropriate naming conventions such as camelCase, snake_case, and kebab-case, while also offering practice exercises for variable naming and creation. Additionally, it includes a Myntra Bag exercise and a project suggestion for a calculator.

Uploaded by

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

Class 22 JavaScript - Variables & Mini Project

The document provides an overview of variables, including their definition, syntax rules, naming conventions, and methods for updating values. It emphasizes the importance of using appropriate naming conventions such as camelCase, snake_case, and kebab-case, while also offering practice exercises for variable naming and creation. Additionally, it includes a Myntra Bag exercise and a project suggestion for a calculator.

Uploaded by

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

Variables

• What are Variables


• Syntax Rules
• Updating Values
• Myntra Bag Exercise
• Naming Conventions
• Ways to create
Variables
What are Variables?

Variables are like containers


used for storing data values.
Syntax Rules

1. Can’t use keywords or reserved words


2. Can’t start with a number
3. No special characters other than $ and _
4. = is for assignment
5. ; means end of instruction
JS Keywords
Naming Conventions
camelCase
• Start with a lowercase letter. Capitalize the first letter of each
subsequent word.
• Example: myVariableName

snake_case
• Start with an lowercase letter. Separate words with underscore
• Example: my_variable_name

Kebab-case
• All lowercase letters. Separate words with hyphens. Used for HTML
and CSS.
• Example: my-variable-name

Keep a Good and Short Name


• Choose names that are descriptive but not too long. It should make
it easy to understand the variable's purpose.
• Example: age, firstName, isMarried
FF5F1F
Practice Exercise
Variable Naming

• username • $budget
• totalAmount • class
• 99balls • 2024Year
• User3 • last_name
• first name • Count99
• new • user@name
• function • boolean
• _score • var
• maxHeight • indexValue
• user-name • tempVar
FF5F1F
Practice Exercise (Solution)
Variable Naming

• username • $budget
• totalAmount • class - Incorrect, uses a reserved keyword.
• 99balls - Incorrect, cannot start with a number. • 2024Year - Incorrect, starts with a number.
• User3 • last_name
• first name - Incorrect, contains a space. • Count99
• new - Incorrect, uses a reserved keyword. • user@name - Incorrect, special characters like @ are
• function - Incorrect, uses a reserved keyword. not allowed.
• _score • boolean - Incorrect, uses a reserved keyword.
• maxHeight • var - Incorrect, uses a reserved keyword.
• user-name - Incorrect, hyphens are not allowed. • indexValue
• tempVar
Updating Values

1. Do not need to use let again.


2. Syntax: variable = variable + 1
3. Assignment Operator is used =
4. Short Hand Assignment Operators:
+=, -=, *=, /=, ++
Myntra Bag Exercise

1. Implement the above three buttons


2. Add to Bag should add an item to the bag
3. Move to wishlist should remove an item from the bag
4. Add 1+1 sale item should add 2 items to the bag
Ways to Create Variables
FF5F1F
Practice Exercise
Variables

1. Save your name in a variable inside script tag


2. Display name from the variable on the page
3. Calculate the cost of Myntra Bag and keep it in a
variable
4. Show it to console
5. Keep GST percentage as constant
6. Use eval method from math to convert string
calculation into result
Project: Calculator

You might also like