feat(curriculum): add interactive editors for JS Variables and Datatypes Review (#65305)

curriculum/challenges/english/blocks/review-javascript-variables-and-data-types/6723be264695fb7e619fe1fa.md

@@ -5,7 +5,7 @@ challengeType: 31
 dashedName: review-javascript-variables-and-data-types
 ---
 
-# --description--
+# --interactive--
 
 ## Working with HTML, CSS, and JavaScript
 
@@ -36,12 +36,16 @@ let pet = {
 
 In this example below, two symbols are created with the same description, but they are not equal.
 
+:::interactive_editor
+
 ```js
 const crypticKey1= Symbol("saltNpepper");
 const crypticKey2= Symbol("saltNpepper");
 console.log(crypticKey1 === crypticKey2); // false
 ```
 
+:::
+
 - **BigInt**: When the number is too large for the `Number` data type, you can use the BigInt data type to represent integers of arbitrary length.
 
 By adding an `n` to the end of the number, you can create a BigInt.
@@ -66,11 +70,16 @@ cityName = "New York";
 
 - Variables declared using `let` can be reassigned a new value.
 
+:::interactive_editor
+
 ```js
+let cityName = "New York";
 cityName = "Los Angeles";
 console.log(cityName); // Los Angeles
 ```
 
+:::
+
 - Apart from `let`, you can also use `const` to declare a variable. However, a `const` variable cannot be reassigned a new value.
 
 ```js
@@ -109,6 +118,8 @@ firstName = "Jane"; // Reassigning the string to a new value
 
 - Concatenation is the process of joining multiple strings or combining strings with variables that hold text. The `+` operator is one of the simplest and most frequently used methods to concatenate strings. 
 
+:::interactive_editor
+
 ```js
 let studentName = "Asad";
 let studentAge = 25;
@@ -116,16 +127,24 @@ let studentInfo = studentName + " is " + studentAge + " years old.";
 console.log(studentInfo); // Asad is 25 years old.
 ```
 
+:::
+
 - If you need to add or append to an existing string, then you can use the  `+=` operator. This is helpful when you want to build upon a string by adding more text to it over time.
 
+:::interactive_editor
+
 ```js
 let message = "Welcome to programming, ";
 message += "Asad!";
 console.log(message); // Welcome to programming, Asad!
 ```
 
+:::
+
 - Another way you can concatenate strings is to use the `concat()` method. This method joins two or more strings together.
 
+:::interactive_editor
+
 ```js
 let firstName = "John";
 let lastName = "Doe";
@@ -133,15 +152,21 @@ let fullName = firstName.concat(" ", lastName);
 console.log(fullName); // John Doe
 ```
 
+:::
+
 ## Logging Messages with `console.log()`
 
 - The `console.log()` method is used to log messages to the console. It's a helpful tool for debugging and testing your code.
 
+:::interactive_editor
+
 ```js
 console.log("Hello, World!");
 // Output: Hello, World!
 ```
 
+:::
+
 ## Semicolons in JavaScript
 
 - Semicolons are primarily used to mark the end of a statement. This helps the JavaScript engine understand the separation of individual instructions, which is crucial for correct execution.
@@ -191,6 +216,8 @@ error = "Not Found"; // This would cause an error in C#
 
 - The `typeof` operator is used to check the data type of a variable. It returns a string indicating the type of the variable.
 
+:::interactive_editor
+
 ```js
 let age = 25;
 console.log(typeof age); // "number"
@@ -199,13 +226,19 @@ let isLoggedIn = true;
 console.log(typeof isLoggedIn); // "boolean"
 ```
 
+:::
+
 - However, there's a well-known quirk in JavaScript when it comes to `null`. The `typeof` operator returns `"object"` for `null` values.
 
+:::interactive_editor
+
 ```js
 let user = null;
 console.log(typeof user); // "object"
 ```
 
+:::
+
 # --assignment--
 
 Review the JavaScript Variables and Data Types topics and concepts.