<main>
  <section>
    <h3>Data Types In JavaScript</h3>

</main>

<div class="console">
  <h3>Output:</h3>
  <div id="output"></div>
</div>

body > main > * { width: 90%; max-width: 768px; margin-left: auto; margin-right: auto; padding-top: 170px; }
.console { width: calc(100% - 80px); overflow-y: auto;height: calc(100% - 60px); position: fixed; background: #060606; padding: 20px; left: 20px; top: 10px; border-radius: 11px; }
#output { font-size: 16px;  }
html, body { width: 100vw; max-width: 100vw; min-width: 320px; margin: 0; padding: 0; background-color: #282a36; color: rgba(248, 248, 242, 0.8); font-family: georgia; }
.title{color:#d05a24;margin-bottom:0}
br{line-height:0}
let myString = "Hello, Javascript!"; // string
let myNumber = 1983; // number
let myBoolean = true; // boolean
let myNull = null; // null
let myUndefined = undefined; // undefined
let mySymbol = Symbol("mySymbol"); // symbol
let myBigInt = 123456789n; // bigint

let num = 42;
console.log(typeof num); // "number"

let str = "Hello";
console.log(typeof str); // "string"

let isTrue = true;
console.log(typeof isTrue); // "boolean"

let obj = {};
console.log(typeof obj); // "object"

let x = null;
console.log(x); // null

let y;
console.log(y); // undefined

console.log(5 == '5'); // true
console.log(5 === '5'); // false

//---------------------

console.log(0 == false );  // true
console.log(0 === false);  // false
console.log(1 == "1" );    // true
console.log(1 === "1" );   // false
console.log(null == undefined); // true
console.log(null === undefined );// false
console.log('0' == false); // true
console.log('0' === false); // false
console.log(NaN == NaN );// false
console.log(NaN === NaN );// false
console.log([]==[]);//false, refer different objects in memory
console.log([]===[]); //false, refer different objects in memory
console.log({}=={} );//false, refer different objects in memory
console.log({}==={});//false, refer different objects in memory

//Symbol

const mySymbol1 = Symbol();
// Create an object with a symbol property
const myObject = {
  [mySymbol1]: "This is a hidden property"
};
// Access the symbol property
console.log(myObject[mySymbol]); // "This is a hidden property"
// Iterate over the object
for (const key in myObject) {
  console.log(key); // "mySymbol" will not be logged
}
//---------------
JSON.stringify({ [Symbol("foo")]: "foo" });
// '{}'
const mySymbol2 = Symbol();
// Create an object with a symbol property
const myObject1 = {
  [mySymbol]: "This is a hidden property"
};
// Access the symbol property
console.log(myObject[mySymbol2]); // "This is a hidden property"
// Iterate over the object
for (const key in myObject) {
  console.log(key); // "mySymbol" will not be logged
}
//---------------
JSON.stringify({ [Symbol("foo")]: "foo" });
// '{}'
//----------
const person = {
  firstName: "Mind",
  lastName: "Hub",
};
let id = Symbol('id');
person[id] = 143;
console.log(person[id])//143
console.log(person.id)//undefined 


// Single quotes
const name = 'Mind Share Hub';

// Double quotes
const age = "30";

// Backticks
const greeting = `Hello, ${name}! You are ${age} years old.`;
console.log(greeting) 

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://mindsharehub.com/js-lib/consol.log.js