From eeb9981251c68b2d9cd52e10a0b1494113e78059 Mon Sep 17 00:00:00 2001
From: Nicole Barnhouse <104863678+nbarnhouse@users.noreply.github.com>
Date: Fri, 13 Dec 2024 15:58:29 -0600
Subject: [PATCH 01/14] created initial file

---
 .../optional-chaining/optional-chaining.md    | 45 +++++++++++++++++++
 1 file changed, 45 insertions(+)
 create mode 100644 content/javascript/concepts/optional-chaining/optional-chaining.md

diff --git a/content/javascript/concepts/optional-chaining/optional-chaining.md b/content/javascript/concepts/optional-chaining/optional-chaining.md
new file mode 100644
index 00000000000..757daa3d998
--- /dev/null
+++ b/content/javascript/concepts/optional-chaining/optional-chaining.md
@@ -0,0 +1,45 @@
+---
+Title: 'Optional Chaining'
+Description: 'A brief description.' # Required; ideally under 150 characters and starts with a noun (used in search engine results and content previews)
+Subjects: 
+  - 'Web Development'
+  - 'Computer Science'
+Tags: # Please only use Tags in the tags.md file (https://github.com/Codecademy/docs/blob/main/documentation/tags.md). If that list feels insufficient, feel free to create a new Tag and add it to tags.md in your PR!
+  - 'A tag'
+CatalogContent: 
+  - 'introduction-to-javascript'
+  - 'paths/front-end-engineer-career-path'
+---
+
+[Introduction - make sure first mention of concept is in **bold**.] (The first 160 characters of this section will appear as the description of the page when it shows up on search engines. It's important!)
+
+## Subsection 1
+
+[Text about subsection 1]
+
+## Subsection 2
+
+[Text about subsection 2]
+
+## Subsection n
+
+[Text about subsection n]
+
+## Codebyte Example (if applicable)
+
+We can currently support:
+
+- Python
+- JavaScript
+- Ruby
+- C++
+- C#
+- Go
+- PHP
+
+See [content-standards.md](https://github.com/Codecademy/docs/blob/main/documentation/content-standards.md) for more details!
+
+```codebyte/js
+# Example runnable code block.
+console.log('Hello, World!');
+```
\ No newline at end of file

From f77744e9e266073a1dca80c416503c4e9c82c6e5 Mon Sep 17 00:00:00 2001
From: Nicole Barnhouse <104863678+nbarnhouse@users.noreply.github.com>
Date: Sun, 15 Dec 2024 17:20:02 -0600
Subject: [PATCH 02/14] added basic description and tags

---
 .../concepts/optional-chaining/optional-chaining.md        | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/content/javascript/concepts/optional-chaining/optional-chaining.md b/content/javascript/concepts/optional-chaining/optional-chaining.md
index 757daa3d998..9d7594132a1 100644
--- a/content/javascript/concepts/optional-chaining/optional-chaining.md
+++ b/content/javascript/concepts/optional-chaining/optional-chaining.md
@@ -1,11 +1,12 @@
 ---
 Title: 'Optional Chaining'
-Description: 'A brief description.' # Required; ideally under 150 characters and starts with a noun (used in search engine results and content previews)
+Description: 'The optional chanining operator' 
 Subjects: 
   - 'Web Development'
   - 'Computer Science'
-Tags: # Please only use Tags in the tags.md file (https://github.com/Codecademy/docs/blob/main/documentation/tags.md). If that list feels insufficient, feel free to create a new Tag and add it to tags.md in your PR!
-  - 'A tag'
+Tags: 
+  - 'Data'
+  - 'Operators'
 CatalogContent: 
   - 'introduction-to-javascript'
   - 'paths/front-end-engineer-career-path'

From f4e4c5082baa38170d86d14232b0159041d183b8 Mon Sep 17 00:00:00 2001
From: Nicole Barnhouse <104863678+nbarnhouse@users.noreply.github.com>
Date: Sun, 15 Dec 2024 20:34:04 -0600
Subject: [PATCH 03/14] initial draft is complete

---
 .../optional-chaining/optional-chaining.md    | 161 +++++++++++++++---
 1 file changed, 141 insertions(+), 20 deletions(-)

diff --git a/content/javascript/concepts/optional-chaining/optional-chaining.md b/content/javascript/concepts/optional-chaining/optional-chaining.md
index 9d7594132a1..d6b96382a2e 100644
--- a/content/javascript/concepts/optional-chaining/optional-chaining.md
+++ b/content/javascript/concepts/optional-chaining/optional-chaining.md
@@ -1,6 +1,6 @@
 ---
 Title: 'Optional Chaining'
-Description: 'The optional chanining operator' 
+Description: 'The optional chanining operator simplifies the comparison of multiple data properties in a chain of connected objects' 
 Subjects: 
   - 'Web Development'
   - 'Computer Science'
@@ -12,35 +12,156 @@ CatalogContent:
   - 'paths/front-end-engineer-career-path'
 ---
 
-[Introduction - make sure first mention of concept is in **bold**.] (The first 160 characters of this section will appear as the description of the page when it shows up on search engines. It's important!)
 
-## Subsection 1
 
-[Text about subsection 1]
+The **optional chanining** operator simplifies the comparison of multiple data properties in a chain of connected objects. This is especially valuable if any of the properties are null as the operatior will return as undefined instead of throwing an error.
 
-## Subsection 2
+Optional chaning can be used to validate nested object properties, call optional functions or methods on optional objects, accessing arrary elements, and more. 
 
-[Text about subsection 2]
+The primary benefits of using optional chaining instead of regular syntax include simplifying the code to achieve the same result so it's easier to read, protecting against runtime errors and enhances maintainability.
 
-## Subsection n
+## Syntax
 
-[Text about subsection n]
+The basic syntax for `optional chaining` can be defined as: 
 
-## Codebyte Example (if applicable)
+```js
+// To access an object property
+object?.property
 
-We can currently support:
+//To access an element in an array
+array?.[index]
 
-- Python
-- JavaScript
-- Ruby
-- C++
-- C#
-- Go
-- PHP
+//To invoke a function (if it exists)
+object?.method?.()
+```
 
-See [content-standards.md](https://github.com/Codecademy/docs/blob/main/documentation/content-standards.md) for more details!
+## Example
+This person object lists an individual's details and containing properties, nested objects, an array, and a method. Optional chaining for each conditional evaluation is listed below. 
+
+```js
+const person = {
+  name: "Alice",
+  gender: "Female",
+  age: 12,
+  address: {
+    street: "1111 Palm Ave", 
+    city: "Broken Arrow",
+    state: "Oklahoma"
+  },
+  favoriteFoods: ["pizza", "ice cream", "cake"], 
+  commonPhrase: function() {
+    return `${this.name} always says "I love ${this.address.state}."`;
+  }
+};
+```
+
+## Accessing Object Properties
+To search for the `state` object of `person`:
+
+```js
+//Regular syntax
+const state = person && person.address && person.address.state;
+console.log(`State is: ${state}`);
+
+//This can be rewritten as:
+const state = person?.address?.state;
+console.log(`State is: ${state}`);
+
+//The output for both is: 
+State is: Oklahoma
+```
+
+## Accessing Arrary Elements
+To search for the `cake` in the `favoriteFoods` array of `person`:
+
+```js
+//Regular Syntax
+const food = person && person.favoriteFoods && person.favoriteFoods.find(item => item === "cake");
+console.log(`Favorite Food is: ${food}`);
+
+//This can be rewritten as:
+const food = person?.favoriteFoods.find(item => item === "cake");
+console.log(`Favorite Food is: ${food}`)
+
+//The output for both is: 
+Favorite Food is: cake
+```
+
+## Accessing Object Functions
+To determine if the `commonPhrase` function exists in `person` before invoking it:
+
+```js
+//Regular Syntax
+if (person && typeof person.commonPhrase === "function") {
+  const phrase = person.commonPhrase();
+console.log(`${phrase}`);
+}
+
+//This can be rewritten as:
+const phrase = person?.commonPhrase?.();
+console.log(`${phrase}`);
+
+//The output for both is: 
+Alice always says "I love Oklahoma."
+```
+
+
+## Codebyte Example
+
+Run the following example and compare the regular syntax of conditional statements and optional chaining on a more complex data set.
 
 ```codebyte/js
-# Example runnable code block.
-console.log('Hello, World!');
+const people = [
+  {
+    name: "Blake",
+    gender: "Male",
+    age: null,
+    address: {
+      street: "456 Maple Dr",
+      city: "Austin",
+      state: "Texas"
+    }
+  },
+  {
+    name: "Eve",
+    gender: "Female",
+    age: 15,
+    address: {
+      street: "789 Birch Ln",
+      city: "",
+      state: "Colorado"
+    }
+  },
+  null,
+  {
+    name: "David",
+    gender: "Male",
+    age: 72,
+    address: {
+      street: "123 Acorn St",
+      city: "Tampa",
+      state: "Florida"
+    }
+  },
+  {
+    name: "Jospeh",
+    gender: "Male",
+    age: 9,
+    address: {
+      street: "987 Pine Ave",
+      city: "Taos",
+      state: "New Mexico"
+    }
+  }
+];
+
+people.forEach((person, index) => {
+  const city = person && person.address && person.address.city;
+  console.log(`Person ${index + 1}: City: ${city}`);
+});
+
+people.forEach((person, index) => {
+const age = person?.age;
+console.log(`Person ${index + 1}: Age: ${age}`);
+});
 ```
\ No newline at end of file

From 7c6348f959d4f5e9fcb087aadcad1cca4eb09839 Mon Sep 17 00:00:00 2001
From: Nicole Barnhouse <104863678+nbarnhouse@users.noreply.github.com>
Date: Sun, 15 Dec 2024 20:39:42 -0600
Subject: [PATCH 04/14] initial draft complete

---
 .../javascript/concepts/optional-chaining/optional-chaining.md  | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/content/javascript/concepts/optional-chaining/optional-chaining.md b/content/javascript/concepts/optional-chaining/optional-chaining.md
index d6b96382a2e..660d5550b46 100644
--- a/content/javascript/concepts/optional-chaining/optional-chaining.md
+++ b/content/javascript/concepts/optional-chaining/optional-chaining.md
@@ -164,4 +164,4 @@ people.forEach((person, index) => {
 const age = person?.age;
 console.log(`Person ${index + 1}: Age: ${age}`);
 });
-```
\ No newline at end of file
+```

From cb9139876a1313545a0116d3b11fd4421327e63e Mon Sep 17 00:00:00 2001
From: Nicole Barnhouse <104863678+nbarnhouse@users.noreply.github.com>
Date: Tue, 17 Dec 2024 17:44:59 -0600
Subject: [PATCH 05/14] Update
 content/javascript/concepts/optional-chaining/optional-chaining.md

Co-authored-by: Pragati Verma <itispragativerma@gmail.com>
---
 .../javascript/concepts/optional-chaining/optional-chaining.md  | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/content/javascript/concepts/optional-chaining/optional-chaining.md b/content/javascript/concepts/optional-chaining/optional-chaining.md
index 660d5550b46..939c03c961b 100644
--- a/content/javascript/concepts/optional-chaining/optional-chaining.md
+++ b/content/javascript/concepts/optional-chaining/optional-chaining.md
@@ -1,6 +1,6 @@
 ---
 Title: 'Optional Chaining'
-Description: 'The optional chanining operator simplifies the comparison of multiple data properties in a chain of connected objects' 
+Description: 'The optional chaining operator simplifies the comparison of multiple data properties in a chain of connected objects.' 
 Subjects: 
   - 'Web Development'
   - 'Computer Science'

From f031ae40b0430322bf7119968a7d43dd51037510 Mon Sep 17 00:00:00 2001
From: Nicole Barnhouse <104863678+nbarnhouse@users.noreply.github.com>
Date: Tue, 17 Dec 2024 17:45:09 -0600
Subject: [PATCH 06/14] Update
 content/javascript/concepts/optional-chaining/optional-chaining.md

Co-authored-by: Pragati Verma <itispragativerma@gmail.com>
---
 .../javascript/concepts/optional-chaining/optional-chaining.md  | 2 --
 1 file changed, 2 deletions(-)

diff --git a/content/javascript/concepts/optional-chaining/optional-chaining.md b/content/javascript/concepts/optional-chaining/optional-chaining.md
index 939c03c961b..47050d6c70c 100644
--- a/content/javascript/concepts/optional-chaining/optional-chaining.md
+++ b/content/javascript/concepts/optional-chaining/optional-chaining.md
@@ -12,8 +12,6 @@ CatalogContent:
   - 'paths/front-end-engineer-career-path'
 ---
 
-
-
 The **optional chanining** operator simplifies the comparison of multiple data properties in a chain of connected objects. This is especially valuable if any of the properties are null as the operatior will return as undefined instead of throwing an error.
 
 Optional chaning can be used to validate nested object properties, call optional functions or methods on optional objects, accessing arrary elements, and more. 

From 8b8e20fc2fdc4a534c245963481bfb05b24b3a35 Mon Sep 17 00:00:00 2001
From: Nicole Barnhouse <104863678+nbarnhouse@users.noreply.github.com>
Date: Tue, 17 Dec 2024 17:45:18 -0600
Subject: [PATCH 07/14] Update
 content/javascript/concepts/optional-chaining/optional-chaining.md

Co-authored-by: Pragati Verma <itispragativerma@gmail.com>
---
 .../javascript/concepts/optional-chaining/optional-chaining.md  | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/content/javascript/concepts/optional-chaining/optional-chaining.md b/content/javascript/concepts/optional-chaining/optional-chaining.md
index 47050d6c70c..60da41430db 100644
--- a/content/javascript/concepts/optional-chaining/optional-chaining.md
+++ b/content/javascript/concepts/optional-chaining/optional-chaining.md
@@ -12,7 +12,7 @@ CatalogContent:
   - 'paths/front-end-engineer-career-path'
 ---
 
-The **optional chanining** operator simplifies the comparison of multiple data properties in a chain of connected objects. This is especially valuable if any of the properties are null as the operatior will return as undefined instead of throwing an error.
+The **optional chaining** operator simplifies comparing multiple data properties in a chain of connected objects. This is especially valuable if any of the properties are `null`, as the operator will return `undefined` instead of throwing an error.
 
 Optional chaning can be used to validate nested object properties, call optional functions or methods on optional objects, accessing arrary elements, and more. 
 

From 69b3200c98d361537302a29a19d9c56bd0fb5489 Mon Sep 17 00:00:00 2001
From: Nicole Barnhouse <104863678+nbarnhouse@users.noreply.github.com>
Date: Tue, 17 Dec 2024 17:45:26 -0600
Subject: [PATCH 08/14] Update
 content/javascript/concepts/optional-chaining/optional-chaining.md

Co-authored-by: Pragati Verma <itispragativerma@gmail.com>
---
 .../javascript/concepts/optional-chaining/optional-chaining.md  | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/content/javascript/concepts/optional-chaining/optional-chaining.md b/content/javascript/concepts/optional-chaining/optional-chaining.md
index 60da41430db..71ba939930e 100644
--- a/content/javascript/concepts/optional-chaining/optional-chaining.md
+++ b/content/javascript/concepts/optional-chaining/optional-chaining.md
@@ -16,7 +16,7 @@ The **optional chaining** operator simplifies comparing multiple data properties
 
 Optional chaning can be used to validate nested object properties, call optional functions or methods on optional objects, accessing arrary elements, and more. 
 
-The primary benefits of using optional chaining instead of regular syntax include simplifying the code to achieve the same result so it's easier to read, protecting against runtime errors and enhances maintainability.
+The primary benefits of using optional chaining instead of regular syntax include simplifying the code to achieve the same result, making it easier to read, protecting against runtime errors, and enhancing maintainability.
 
 ## Syntax
 

From 745036872e2c949b8743702348e7c1454de5bdb1 Mon Sep 17 00:00:00 2001
From: Nicole Barnhouse <104863678+nbarnhouse@users.noreply.github.com>
Date: Tue, 17 Dec 2024 17:45:45 -0600
Subject: [PATCH 09/14] Update
 content/javascript/concepts/optional-chaining/optional-chaining.md

Co-authored-by: Pragati Verma <itispragativerma@gmail.com>
---
 .../javascript/concepts/optional-chaining/optional-chaining.md  | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/content/javascript/concepts/optional-chaining/optional-chaining.md b/content/javascript/concepts/optional-chaining/optional-chaining.md
index 71ba939930e..00d8515ac4a 100644
--- a/content/javascript/concepts/optional-chaining/optional-chaining.md
+++ b/content/javascript/concepts/optional-chaining/optional-chaining.md
@@ -153,11 +153,13 @@ const people = [
   }
 ];
 
+// Regular syntax for checking if a person's city exists
 people.forEach((person, index) => {
   const city = person && person.address && person.address.city;
   console.log(`Person ${index + 1}: City: ${city}`);
 });
 
+// Optional chaining for simpler access
 people.forEach((person, index) => {
 const age = person?.age;
 console.log(`Person ${index + 1}: Age: ${age}`);

From f557988eb0664b78f603463343377b63ef116403 Mon Sep 17 00:00:00 2001
From: Nicole Barnhouse <104863678+nbarnhouse@users.noreply.github.com>
Date: Tue, 17 Dec 2024 17:45:55 -0600
Subject: [PATCH 10/14] Update
 content/javascript/concepts/optional-chaining/optional-chaining.md

Co-authored-by: Pragati Verma <itispragativerma@gmail.com>
---
 .../javascript/concepts/optional-chaining/optional-chaining.md  | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/content/javascript/concepts/optional-chaining/optional-chaining.md b/content/javascript/concepts/optional-chaining/optional-chaining.md
index 00d8515ac4a..97c7123ca75 100644
--- a/content/javascript/concepts/optional-chaining/optional-chaining.md
+++ b/content/javascript/concepts/optional-chaining/optional-chaining.md
@@ -20,7 +20,7 @@ The primary benefits of using optional chaining instead of regular syntax includ
 
 ## Syntax
 
-The basic syntax for `optional chaining` can be defined as: 
+The basic syntax for using optional chaining is as follows: 
 
 ```js
 // To access an object property

From d3cad8d4cc348952b88b9c7f63b2a1c5627e2aef Mon Sep 17 00:00:00 2001
From: Pragati Verma <itispragativerma@gmail.com>
Date: Tue, 24 Dec 2024 16:15:07 +0530
Subject: [PATCH 11/14] Update optional-chaining.md

---
 .../optional-chaining/optional-chaining.md    | 84 ++++++++++++-------
 1 file changed, 52 insertions(+), 32 deletions(-)

diff --git a/content/javascript/concepts/optional-chaining/optional-chaining.md b/content/javascript/concepts/optional-chaining/optional-chaining.md
index 97c7123ca75..cc4a91167e3 100644
--- a/content/javascript/concepts/optional-chaining/optional-chaining.md
+++ b/content/javascript/concepts/optional-chaining/optional-chaining.md
@@ -14,7 +14,7 @@ CatalogContent:
 
 The **optional chaining** operator simplifies comparing multiple data properties in a chain of connected objects. This is especially valuable if any of the properties are `null`, as the operator will return `undefined` instead of throwing an error.
 
-Optional chaning can be used to validate nested object properties, call optional functions or methods on optional objects, accessing arrary elements, and more. 
+Optional chaning can be used to validate nested object properties, call optional functions or methods on optional objects, accessing array elements, and more. 
 
 The primary benefits of using optional chaining instead of regular syntax include simplifying the code to achieve the same result, making it easier to read, protecting against runtime errors, and enhancing maintainability.
 
@@ -33,8 +33,10 @@ array?.[index]
 object?.method?.()
 ```
 
-## Example
-This person object lists an individual's details and containing properties, nested objects, an array, and a method. Optional chaining for each conditional evaluation is listed below. 
+## Examples
+
+### Accessing Object Properties
+To search for the `state` object of `person`:
 
 ```js
 const person = {
@@ -44,48 +46,66 @@ const person = {
   address: {
     street: "1111 Palm Ave", 
     city: "Broken Arrow",
-    state: "Oklahoma"
+    state1: "Oklahoma"
   },
   favoriteFoods: ["pizza", "ice cream", "cake"], 
   commonPhrase: function() {
-    return `${this.name} always says "I love ${this.address.state}."`;
+    return `${this.name} always says "I love ${this.address.state1}."`;
   }
 };
-```
 
-## Accessing Object Properties
-To search for the `state` object of `person`:
+// Regular syntax for checking if the state1 property exists
+const state1Regular = person && person.address && person.address.state1;
+console.log(`State (regular syntax) is: ${state1Regular}`);
 
-```js
-//Regular syntax
-const state = person && person.address && person.address.state;
-console.log(`State is: ${state}`);
+// This can be rewritten as:
+const state1Chaining = person?.address?.state1;
+console.log(`State (optional chaining) is: ${state1Chaining}`);
+```
 
-//This can be rewritten as:
-const state = person?.address?.state;
-console.log(`State is: ${state}`);
+The output of the above code will be as follows:
 
-//The output for both is: 
-State is: Oklahoma
+```shell
+State (regular syntax) is: Oklahoma
+State (optional chaining) is: Oklahoma
 ```
 
-## Accessing Arrary Elements
+### Accessing Array Elements
 To search for the `cake` in the `favoriteFoods` array of `person`:
 
 ```js
-//Regular Syntax
-const food = person && person.favoriteFoods && person.favoriteFoods.find(item => item === "cake");
-console.log(`Favorite Food is: ${food}`);
+const person = {
+  name: "Alice",
+  gender: "Female",
+  age: 12,
+  address: {
+    street: "1111 Palm Ave", 
+    city: "Broken Arrow",
+    state1: "Oklahoma"
+  },
+  favoriteFoods: ["pizza", "ice cream", "cake"], 
+  commonPhrase: function() {
+    return `${this.name} always says "I love ${this.address.state1}."`;
+  }
+};
 
-//This can be rewritten as:
-const food = person?.favoriteFoods.find(item => item === "cake");
-console.log(`Favorite Food is: ${food}`)
+// Regular Syntax for searching favorite food
+const foodRegular = person && person.favoriteFoods && person.favoriteFoods.find(item => item === "cake");
+console.log(`Favorite Food (regular syntax) is: ${foodRegular}`);
 
-//The output for both is: 
-Favorite Food is: cake
+// This can be rewritten as:
+const foodChaining = person?.favoriteFoods.find(item => item === "cake");
+console.log(`Favorite Food (optional chaining) is: ${foodChaining}`);
+```
+
+The output of the above code will be as follows:
+
+```shell
+Favorite Food (regular syntax) is: cake
+Favorite Food (optional chaining) is: cake
 ```
 
-## Accessing Object Functions
+### Accessing Object Functions
 To determine if the `commonPhrase` function exists in `person` before invoking it:
 
 ```js
@@ -153,15 +173,15 @@ const people = [
   }
 ];
 
-// Regular syntax for checking if a person's city exists
+console.log("Using Regular Syntax for City:");
 people.forEach((person, index) => {
   const city = person && person.address && person.address.city;
-  console.log(`Person ${index + 1}: City: ${city}`);
+  console.log(`Person ${index + 1}: City: ${city ?? "Not Available"}`);
 });
 
-// Optional chaining for simpler access
+console.log("\nUsing Optional Chaining for Age:");
 people.forEach((person, index) => {
-const age = person?.age;
-console.log(`Person ${index + 1}: Age: ${age}`);
+  const age = person?.age;
+  console.log(`Person ${index + 1}: Age: ${age ?? "Not Available"}`);
 });
 ```

From 9c5c47eda9cc1cef736199ec30cccf91a4b8c638 Mon Sep 17 00:00:00 2001
From: PragatiVerma18 <itispragativerma@gmail.com>
Date: Tue, 24 Dec 2024 16:26:34 +0530
Subject: [PATCH 12/14] Fix lint errors

---
 .../optional-chaining/optional-chaining.md    | 63 ++++++++++---------
 1 file changed, 34 insertions(+), 29 deletions(-)

diff --git a/content/javascript/concepts/optional-chaining/optional-chaining.md b/content/javascript/concepts/optional-chaining/optional-chaining.md
index cc4a91167e3..002b65410ee 100644
--- a/content/javascript/concepts/optional-chaining/optional-chaining.md
+++ b/content/javascript/concepts/optional-chaining/optional-chaining.md
@@ -1,57 +1,58 @@
 ---
 Title: 'Optional Chaining'
-Description: 'The optional chaining operator simplifies the comparison of multiple data properties in a chain of connected objects.' 
-Subjects: 
+Description: 'The optional chaining operator simplifies the comparison of multiple data properties in a chain of connected objects.'
+Subjects:
   - 'Web Development'
   - 'Computer Science'
-Tags: 
+Tags:
   - 'Data'
   - 'Operators'
-CatalogContent: 
+CatalogContent:
   - 'introduction-to-javascript'
   - 'paths/front-end-engineer-career-path'
 ---
 
 The **optional chaining** operator simplifies comparing multiple data properties in a chain of connected objects. This is especially valuable if any of the properties are `null`, as the operator will return `undefined` instead of throwing an error.
 
-Optional chaning can be used to validate nested object properties, call optional functions or methods on optional objects, accessing array elements, and more. 
+Optional chaning can be used to validate nested object properties, call optional functions or methods on optional objects, accessing array elements, and more.
 
 The primary benefits of using optional chaining instead of regular syntax include simplifying the code to achieve the same result, making it easier to read, protecting against runtime errors, and enhancing maintainability.
 
 ## Syntax
 
-The basic syntax for using optional chaining is as follows: 
+The basic syntax for using optional chaining is as follows:
 
 ```js
 // To access an object property
-object?.property
+object?.property;
 
 //To access an element in an array
-array?.[index]
+array?.[index];
 
 //To invoke a function (if it exists)
-object?.method?.()
+object?.method?.();
 ```
 
 ## Examples
 
 ### Accessing Object Properties
+
 To search for the `state` object of `person`:
 
 ```js
 const person = {
-  name: "Alice",
-  gender: "Female",
+  name: 'Alice',
+  gender: 'Female',
   age: 12,
   address: {
-    street: "1111 Palm Ave", 
-    city: "Broken Arrow",
-    state1: "Oklahoma"
+    street: '1111 Palm Ave',
+    city: 'Broken Arrow',
+    state1: 'Oklahoma',
   },
-  favoriteFoods: ["pizza", "ice cream", "cake"], 
-  commonPhrase: function() {
+  favoriteFoods: ['pizza', 'ice cream', 'cake'],
+  commonPhrase: function () {
     return `${this.name} always says "I love ${this.address.state1}."`;
-  }
+  },
 };
 
 // Regular syntax for checking if the state1 property exists
@@ -71,30 +72,34 @@ State (optional chaining) is: Oklahoma
 ```
 
 ### Accessing Array Elements
+
 To search for the `cake` in the `favoriteFoods` array of `person`:
 
 ```js
 const person = {
-  name: "Alice",
-  gender: "Female",
+  name: 'Alice',
+  gender: 'Female',
   age: 12,
   address: {
-    street: "1111 Palm Ave", 
-    city: "Broken Arrow",
-    state1: "Oklahoma"
+    street: '1111 Palm Ave',
+    city: 'Broken Arrow',
+    state1: 'Oklahoma',
   },
-  favoriteFoods: ["pizza", "ice cream", "cake"], 
-  commonPhrase: function() {
+  favoriteFoods: ['pizza', 'ice cream', 'cake'],
+  commonPhrase: function () {
     return `${this.name} always says "I love ${this.address.state1}."`;
-  }
+  },
 };
 
 // Regular Syntax for searching favorite food
-const foodRegular = person && person.favoriteFoods && person.favoriteFoods.find(item => item === "cake");
+const foodRegular =
+  person &&
+  person.favoriteFoods &&
+  person.favoriteFoods.find((item) => item === 'cake');
 console.log(`Favorite Food (regular syntax) is: ${foodRegular}`);
 
 // This can be rewritten as:
-const foodChaining = person?.favoriteFoods.find(item => item === "cake");
+const foodChaining = person?.favoriteFoods.find((item) => item === 'cake');
 console.log(`Favorite Food (optional chaining) is: ${foodChaining}`);
 ```
 
@@ -106,6 +111,7 @@ Favorite Food (optional chaining) is: cake
 ```
 
 ### Accessing Object Functions
+
 To determine if the `commonPhrase` function exists in `person` before invoking it:
 
 ```js
@@ -119,11 +125,10 @@ console.log(`${phrase}`);
 const phrase = person?.commonPhrase?.();
 console.log(`${phrase}`);
 
-//The output for both is: 
+//The output for both is:
 Alice always says "I love Oklahoma."
 ```
 
-
 ## Codebyte Example
 
 Run the following example and compare the regular syntax of conditional statements and optional chaining on a more complex data set.

From 4682e97253b1e3547f55206635a309baff846236 Mon Sep 17 00:00:00 2001
From: Mamta Wardhani <mamta.wardhani@gmail.com>
Date: Fri, 27 Dec 2024 21:38:53 +0530
Subject: [PATCH 13/14] Update optional-chaining.md

minor fixes
---
 .../optional-chaining/optional-chaining.md       | 16 ++++++++++------
 1 file changed, 10 insertions(+), 6 deletions(-)

diff --git a/content/javascript/concepts/optional-chaining/optional-chaining.md b/content/javascript/concepts/optional-chaining/optional-chaining.md
index 002b65410ee..7819e849719 100644
--- a/content/javascript/concepts/optional-chaining/optional-chaining.md
+++ b/content/javascript/concepts/optional-chaining/optional-chaining.md
@@ -1,6 +1,6 @@
 ---
 Title: 'Optional Chaining'
-Description: 'The optional chaining operator simplifies the comparison of multiple data properties in a chain of connected objects.'
+Description: 'The optional chaining operator allows safe access to nested object properties or methods without having to explicitly check if intermediate properties exist.'
 Subjects:
   - 'Web Development'
   - 'Computer Science'
@@ -12,7 +12,7 @@ CatalogContent:
   - 'paths/front-end-engineer-career-path'
 ---
 
-The **optional chaining** operator simplifies comparing multiple data properties in a chain of connected objects. This is especially valuable if any of the properties are `null`, as the operator will return `undefined` instead of throwing an error.
+The **optional chaining** (**`?.`**) operator simplifies comparing multiple data properties in a chain of connected objects. This is especially valuable if any of the properties are `null`, as the operator will return `undefined` instead of throwing an error.
 
 Optional chaning can be used to validate nested object properties, call optional functions or methods on optional objects, accessing array elements, and more.
 
@@ -22,7 +22,7 @@ The primary benefits of using optional chaining instead of regular syntax includ
 
 The basic syntax for using optional chaining is as follows:
 
-```js
+```pseudo
 // To access an object property
 object?.property;
 
@@ -124,16 +124,20 @@ console.log(`${phrase}`);
 //This can be rewritten as:
 const phrase = person?.commonPhrase?.();
 console.log(`${phrase}`);
+```
+
+The output of the above code will be as follows:
 
-//The output for both is:
+```shell
+Alice always says "I love Oklahoma."
 Alice always says "I love Oklahoma."
 ```
 
 ## Codebyte Example
 
-Run the following example and compare the regular syntax of conditional statements and optional chaining on a more complex data set.
+Run the following example and compare the regular syntax of conditional statements and optional chaining on a more complex data set:
 
-```codebyte/js
+```codebyte/javascript
 const people = [
   {
     name: "Blake",

From 67ffcb40f8027c36ffc6f23c3a2600be8dd64e19 Mon Sep 17 00:00:00 2001
From: Mamta Wardhani <mamta.wardhani@gmail.com>
Date: Fri, 27 Dec 2024 22:25:17 +0530
Subject: [PATCH 14/14] Update optional-chaining.md

format fixed
---
 .../concepts/optional-chaining/optional-chaining.md           | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/content/javascript/concepts/optional-chaining/optional-chaining.md b/content/javascript/concepts/optional-chaining/optional-chaining.md
index 7819e849719..72ee9a2811e 100644
--- a/content/javascript/concepts/optional-chaining/optional-chaining.md
+++ b/content/javascript/concepts/optional-chaining/optional-chaining.md
@@ -116,9 +116,9 @@ To determine if the `commonPhrase` function exists in `person` before invoking i
 
 ```js
 //Regular Syntax
-if (person && typeof person.commonPhrase === "function") {
+if (person && typeof person.commonPhrase === 'function') {
   const phrase = person.commonPhrase();
-console.log(`${phrase}`);
+  console.log(`${phrase}`);
 }
 
 //This can be rewritten as: