Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Commit 189dcaa

Browse files
committed
JavaScript Operators Staus:DONE
1 parent dc0cd43 commit 189dcaa

File tree

1 file changed

+196
-5
lines changed

1 file changed

+196
-5
lines changed

‎09-JavaScript-Operators.md

Lines changed: 196 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,18 @@
1+
**Table of Content**
2+
3+
- [Expression and Operators](#expression-and-operators)
4+
- [Types of Operator](#types-of-operator)
5+
- [`Assignment Operator`](#assignment-operator)
6+
- [`Comparision Operator`](#comparision-operator)
7+
- [`Arithematic Operator`](#arithematic-operator)
8+
- [`Logical Operator`](#logical-operator)
9+
- [`Logical AND (&&)`](#logical-and-)
10+
- [`Logical OR (||)`](#logical-or-)
11+
- [`Logical NOT (!)`](#logical-not-)
12+
- [`Conditional (Ternary) Operator`](#conditional-ternary-operator)
13+
- [`Unary Operator`](#unary-operator)
14+
- [`Relational Operator`](#relational-operator)
15+
116
# Expression and Operators
217

318
An expression is a valid piece of code that resolves to a value. There are two types of expressions: those that have effects such as asssigning the value and those who evaluate value.
@@ -6,8 +21,13 @@ For example: `x = 7` is a expression that assigns the value of 7 to the variable
621

722
## Types of Operator
823

9-
- Assignment Operator: It assigns a value to its left operand to the value at its right operand with the operator `=`.
10-
- Comparision Operator: It compares its operands and returns a logical value based on whether the comparision is `true` or `false`. If two operands are not of same type, JS attempts to convert them to appropriate type for comparision.
24+
### `Assignment Operator`
25+
26+
It assigns a value to its left operand to the value at its right operand with the operator `=`.
27+
28+
### `Comparision Operator`
29+
30+
It compares its operands and returns a logical value based on whether the comparision is `true` or `false`. If two operands are not of same type, JS attempts to convert them to appropriate type for comparision.
1131

1232
| Operator | Description |
1333
| -------------------------- | --------------------------------------------------------------------------------------------------- |
@@ -20,7 +40,9 @@ For example: `x = 7` is a expression that assigns the value of 7 to the variable
2040
| Less than (<) | Returns true if the left operand is less than the right operand. |
2141
| Less than or equal (<=) | Returns true if the left operand is less than or equal to the right operand. |
2242

23-
- Arithematic Operator: It takes numerical values as operands and returns single numerical value.The standard arithematic operations are addition `(+)`, subtraction `(-)`, multiplication `(*)` and division `(/)`.
43+
### `Arithematic Operator`
44+
45+
It takes numerical values as operands and returns single numerical value.The standard arithematic operations are addition `(+)`, subtraction `(-)`, multiplication `(*)` and division `(/)`.
2446

2547
```js
2648
20 / 2; //10
@@ -41,7 +63,9 @@ In addition to the standard arithematic operations `(+,-,*,/)`, JS also provides
4163
| Less than (<) | Returns true if the left operand is less than the right operand. |
4264
| Less than or equal (<=) | Returns true if the left operand is less than or equal to the right operand. |
4365

44-
- Bitwise Operator: Bitwise operator treats their operands as a set of 32 bits (1s and 0s). For example, the decimal `7` has a binary represntation of `111`. Bitwise operators perform their operations on such binary representations but they return numerical values.
66+
###` Bitwise Operator`
67+
68+
Bitwise operator treats their operands as a set of 32 bits (1s and 0s). For example, the decimal `7` has a binary represntation of `111`. Bitwise operators perform their operations on such binary representations but they return numerical values.
4569

4670
| Operator | Description |
4771
| --------------------- | ------------------------------------------------------------------------------------------------ |
@@ -50,4 +74,171 @@ In addition to the standard arithematic operations `(+,-,*,/)`, JS also provides
5074
| Bitwise XOR (`a ^ b`) | Returns a zero in each bit position for which the corresponding bits are the same. |
5175
| Bitwise NOT (`~ a`) | Inverts the bits of its operand. |
5276

53-
- Logical Operator: They are typically used with boolean values however `&&` and `||` operators actually return the value of one of the specified operands,so if the operands are used with non-boolean values, they may return non-boolean values.
77+
### `Logical Operator`
78+
79+
They are typically used with boolean values however `&&` and `||` operators actually return the value of one of the specified operands,so if the operands are used with non-boolean values, they may return non-boolean values.
80+
81+
| Operator | Description |
82+
| ------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
83+
| Logical AND `(&&)` | `(a && b)` returns `a` if it can be converted to false; otherwise, it returns `b`. Thus, when used with Boolean values, `&&` returns `true` if both operands are `true`; otherwise, returns `false`. |
84+
| Logical OR `(\|\|)` | `(a \|\| b)` returns `a` if it can be converted to true; otherwise, it returns `b`. Thus, when used with Boolean values, `\|\|` returns `true` if either operand is `true`; if both are `false`, returns `false`. |
85+
| Logical NOT `(!)` | `(!a)` returns `false` if its single operand can be converted to `true`; otherwise, it returns `true`. |
86+
87+
#### `Logical AND (&&)`
88+
89+
```js
90+
const weirdo = "Cat" && "Dog"; //OUTPUT: Dog
91+
```
92+
93+
Here, `Cat && Dog` evaluates to "Dog" because as mentioned above, `&&` operator when used with two operands, evaluates left operand first and if it can be converted to `false`, it returns the left-hand operand _(Cat in this case)_ else returns the right-hand operand _(Dog in this case)_.
94+
95+
To elaborate, the left-hand operand "Cat" can be converted to `true`, since it is not a empty string. Therefore, JavaScript proceeds to evaluate right-hand operand "Dog" which also can be converted to `true`. _Since, both the operands are `true`, logical AND operator returns the right-hand operator_ i.e. Dog.
96+
97+
**More Examples of `&&` Operator:**
98+
99+
```js
100+
const a1 = true && true; // returns true
101+
const a2 = true && false; // returns false
102+
const a3 = false && true; // returns false
103+
const a4 = false && 3 === 4; // returns false
104+
const a5 = "Cat" && "Dog"; // returns Dog
105+
const a6 = false && "Cat"; // returns false
106+
const a7 = "Cat" && false; // returns false
107+
```
108+
109+
You should try to understand these expressions and the reasons for yourself.
110+
111+
#### `Logical OR (||)`
112+
113+
```js
114+
const nextWeirdo = "Cat" || "Dog"; //OUPUT: Cat
115+
```
116+
117+
Here, `Cat || Dog` evaluates to "Cat" because as mentioned above, `||` operator when used with two operands, evaluates left operand first and if it can be converted to `true`, it returns the left-hand operand _(Cat in this case)_ else returns the right-hand operand _(Dog in this case)_.
118+
119+
To elaborate, the left-hand operand "Cat" can be converted to `true`, since it is not a empty string. Therefore, JavaScript returns the left-hand operand i.e. "Cat". The right-hand operand "Dog" is not even evaluated since the right-hand operand is already `true`.
120+
121+
**More Examples of `||` Operator:**
122+
123+
```js
124+
const o1 = true || true; // returns true
125+
const o2 = false || true; // returns true
126+
const o3 = true || false; // returns true
127+
const o4 = false || 3 === 4; // returns false
128+
const o5 = "Cat" || "Dog"; // returns Cat
129+
const o6 = false || "Cat"; // returns Cat
130+
const o7 = "Cat" || false; // returns Cat
131+
```
132+
133+
#### `Logical NOT (!)`
134+
135+
```js
136+
const n1 = !true; // returns false
137+
const n2 = !false; // returns true
138+
const n3 = !"Cat"; // returns false
139+
```
140+
141+
### `Conditional (Ternary) Operator`
142+
143+
Conditional Operator is the only JavaScript operator that takes three operands.
144+
145+
Syntax:
146+
147+
```
148+
condition ? val1 : val2;
149+
```
150+
151+
If the condition is `true`, the operator has the value of `val1` else it has the value of `val2`. We can use the ternary operator anywhere we would use standard operator.
152+
153+
Example:
154+
155+
```js
156+
const entry = age >= 18 ? "accepted" : "rejected";
157+
```
158+
159+
This statement assigns the value of `entry` to "accepted" if the age is 18 or more else it assigns the value to "rejected".
160+
161+
### `Unary Operator`
162+
163+
A unary operation is an operation with only one operand.
164+
165+
- `delete`: it deletes and object's property.
166+
167+
```
168+
delete object.property;
169+
delete object[propertyKey];
170+
delete objectName[index];
171+
```
172+
173+
If the `delete` operator succeeds, it removes the property from the object. When we try to access that property afterwards, it will return `undefined`.
174+
175+
```js
176+
delete Math.PI; // returns false (cannot delete non-configurable properties)
177+
178+
const myObj = { x: 2 };
179+
delete myObj.h; // returns true (can delete user-defined properties)
180+
```
181+
182+
- `typeof`: This operator returns a string indicating the type of the operand.
183+
184+
```js
185+
const addFunc = new Function("2 + 2");
186+
const shape = "round";
187+
const size = 12;
188+
const fruits = ["Apple", "Mango", "Orange"];
189+
const today = new Date();
190+
const isSingle = true;
191+
192+
typeof addFunc; // returns "function"
193+
typeof shape; // returns "string"
194+
typeof size; // returns "number"
195+
typeof fruits; // returns "object"
196+
typeof today; // returns "object"
197+
typeof doesntExist; // returns "undefined"
198+
typeof isSingle; // returns "boolean"
199+
```
200+
201+
### `Relational Operator`
202+
203+
A relational operator compares its operands and returns a value based on whether the comparison is truthy.
204+
205+
- `in`: This operator returns `true` if the specified property is in the specified object.
206+
207+
Syntax:
208+
209+
```
210+
propertyName in objectName;
211+
```
212+
213+
```js
214+
// Arrays
215+
const fruits = ["mango", "apple", "grape", "plum", "papaya"];
216+
0 in fruits; // returns true
217+
3 in fruits; // returns true
218+
6 in fruits; // returns false
219+
"apple" in fruits; // returns false
220+
// (you must specify the index number, not the value at that index)
221+
"length" in fruits; // returns true (length is an Array property)
222+
223+
// built-in objects
224+
"PI" in Math; // returns true
225+
const myName = new String("entry");
226+
"length" in myString; // returns true
227+
228+
// Custom objects
229+
const myFriends = { name: "Yogendra", hobby: "Sleeping", year: 2000 };
230+
"name" in myFriends; // returns true
231+
"hobby" in myFriends; // returns true
232+
```
233+
234+
```
235+
Well, you may be wondering why `0 in fruits` evaluates to `true` but `apple in fruits` evaluate to `false`.
236+
```
237+
238+
The reason for this is because the `in` operator in JavaScript is used to check if a specified property/key exists in an `object` or `array`.
239+
240+
In the case of `0 in fruits`, it is checking whether the fruits array has a property/key of 0, which it does since arrays in JavaScript are objects with numeric keys starting from 0. Therefore, the expression 0 in fruits returns `true`.
241+
242+
However, "apple" in fruits is checking whether the fruits array has a property/key of "apple", which it does not, since the elements of the array are not considered keys. Therefore, the expression "apple" in fruits returns `false`.
243+
244+
To check if a value exists in an array, you can use the `includes()` method instead: `fruits.includes("apple")` would return `true` because the value "apple" exists in the array.

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /