{"id":543,"date":"2025-05-19T11:04:22","date_gmt":"2025-05-19T11:04:22","guid":{"rendered":"https:\/\/buhave.com\/courses\/?p=543"},"modified":"2025-05-20T12:57:18","modified_gmt":"2025-05-20T12:57:18","slug":"basics-and-syntax","status":"publish","type":"post","link":"https:\/\/buhave.com\/courses\/java-script\/basics-and-syntax\/","title":{"rendered":"Basics and Syntax"},"content":{"rendered":"

Variables (let, const, var)<\/h2>\n

1. What Are Variables?<\/h3>\n

Variables store data values that can be used and manipulated in your code.<\/p>\n

let name = “Alice”;<\/em>
\nconst age = 30;<\/em>
\nvar city = “Paris”;<\/em><\/p>\n

2. let \u2013 Block-scoped, Reassignable<\/h3>\n

Introduced in ES6 (2015), let is the go-to for variables that can change.<\/p>\n

let counter = 1;<\/em>
\ncounter = 2; \/\/ reassigning is allowed<\/em><\/p>\n

Characteristics:<\/strong><\/p>\n

    \n
  • Block-scoped (confined to {}).<\/li>\n
  • Can be updated, but not re-declared in the same scope.<\/li>\n
  • Does not hoist the same way var does (it has a “temporal dead zone”).<\/li>\n<\/ul>\n

    {<\/em>
    \nlet x = 10;<\/em>
    \n}<\/em>
    \n\/\/ console.log(x); ReferenceError: x is not defined<\/em><\/p>\n

    3. const \u2013 Block-scoped, Not Reassignable<\/h3>\n

    Used for constants \u2013 values that shouldn\u2019t change.<\/p>\n

    const pi = 3.14;<\/em>
    \n\/\/ pi = 3.14159 Error: Assignment to constant variable<\/em><\/p>\n

    Characteristics:<\/strong><\/p>\n

      \n
    • Also block-scoped.<\/li>\n
    • Must be initialized when declared.<\/li>\n
    • You can\u2019t reassign, but if the value is an object or array, its contents can be changed.<\/li>\n<\/ul>\n

      const person = { name: “Alice” };<\/em>
      \nperson.name = “Bob”; \/\/ allowed<\/em><\/p>\n

      4. var \u2013 Function-scoped, Legacy<\/h3>\n

      Old way (pre-ES6) of declaring variables.<\/p>\n

      var color = “blue”;<\/em>
      \ncolor = “red”; \/\/<\/em><\/p>\n

      Characteristics:<\/strong><\/p>\n

        \n
      • Function-scoped, not block-scoped.<\/li>\n
      • Can be re-declared and updated.<\/li>\n
      • Hoisted to the top of its function \u2014 initialized as undefined.<\/li>\n<\/ul>\n

        console.log(a); \/\/ undefined<\/em>
        \nvar a = 5;<\/em><\/p>\n

        5. Comparison Table<\/h3>\n\n\n\n\n\n\n\n\n\n
        Feature<\/th>\nvar<\/th>\nlet<\/th>\nconst<\/th>\n<\/tr>\n<\/thead>\n
        Scope<\/td>\nFunction<\/td>\nBlock<\/td>\nBlock<\/td>\n<\/tr>\n
        Hoisting<\/td>\nYes (initialized to undefined)<\/td>\nYes (in TDZ)<\/td>\nYes (in TDZ)<\/td>\n<\/tr>\n
        Reassignable<\/td>\nyes<\/td>\nyes<\/td>\nno<\/td>\n<\/tr>\n
        Redeclarable<\/td>\nyes<\/td>\nno<\/td>\nno<\/td>\n<\/tr>\n
        Use Case<\/td>\nLegacy code<\/td>\nMutable variables<\/td>\nImmutable bindings<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

        Best Practices:<\/strong><\/p>\n

          \n
        • Use **let** when the value will change.<\/li>\n
        • Use **const** by default \u2014 only switch to let if needed.<\/li>\n
        • Avoid **var** unless working with legacy code.<\/li>\n<\/ul>\n

          Data types (Number, String, Boolean, Null, Undefined, Symbol)<\/h2>\n

          1. Primitive Data Types in JavaScript<\/h3>\n

          JavaScript has 7 primitive types (6 main ones + BigInt added in ES2020):<\/strong><\/p>\n\n\n\n\n\n\n\n\n\n\n\n
          Type<\/th>\nDescription<\/th>\n<\/tr>\n<\/thead>\n
          Number<\/td>\nNumeric values (integer or float)<\/td>\n<\/tr>\n
          String<\/td>\nText values<\/td>\n<\/tr>\n
          Boolean<\/td>\ntrue or false<\/td>\n<\/tr>\n
          Null<\/td>\nIntentional absence of value<\/td>\n<\/tr>\n
          Undefined<\/td>\nDeclared but not assigned<\/td>\n<\/tr>\n
          Symbol<\/td>\nUnique and immutable identifier (ES6)<\/td>\n<\/tr>\n
          BigInt<\/td>\nFor very large integers (optional\/advanced)<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

          2. Number<\/h3>\n

          Represents both integers and floating-point numbers.<\/p>\n

          let age = 30;<\/em>
          \nlet price = 19.99;<\/em><\/p>\n

          Notes:<\/strong><\/p>\n

            \n
          • All numbers are 64-bit floating point under the hood.<\/li>\n<\/ul>\n

            Special values:<\/strong><\/p>\n

              \n
            • Infinity, -Infinity, NaN (Not a Number)<\/li>\n<\/ul>\n

              console.log(1 \/ 0); \/\/ Infinity<\/em>
              \nconsole.log(“a” \/ 2); \/\/ NaN<\/em><\/p>\n

              3. String<\/h3>\n

              Represents text data.<\/p>\n

              let name = “Alice”;<\/em>
              \nlet greeting = ‘Hello’;<\/em>
              \nlet phrase = `Hi, ${name}`;<\/em><\/p>\n

              Notes:<\/strong><\/p>\n

                \n
              • Can be declared with single, double, or backticks.<\/li>\n
              • Backticks (`) allow template literals and interpolation.<\/li>\n<\/ul>\n

                let result = `2 + 2 = ${2 + 2}`; \/\/ “2 + 2 = 4”<\/em><\/p>\n

                4. Boolean<\/h3>\n

                Represents a true\/false value.<\/p>\n

                let isActive = true;<\/em>
                \nlet isLoggedIn = false;<\/em><\/p>\n

                Notes:<\/strong><\/p>\n

                  \n
                • Used in conditionals, logic, and comparisons.<\/li>\n
                • Falsy values include: false, 0, “”, null, undefined, NaN<\/li>\n<\/ul>\n

                  5. Null<\/h3>\n

                  Represents intentional absence of any value.<\/p>\n

                  let score = null;<\/em><\/p>\n

                  Notes:<\/strong><\/p>\n

                    \n
                  • Often used to reset or clear a variable.<\/li>\n
                  • typeof null is “object” \u2014 a quirk in JavaScript.<\/li>\n<\/ul>\n

                    6. Undefined<\/h3>\n

                    A variable that\u2019s declared but not assigned.<\/p>\n

                    let x;<\/em>
                    \nconsole.log(x); \/\/ undefined<\/em><\/p>\n

                    Notes:<\/strong><\/p>\n

                      \n
                    • Also returned by functions that don\u2019t explicitly return anything.<\/li>\n
                    • JavaScript uses it to signal “missing” or “uninitialized”.<\/li>\n<\/ul>\n

                      7. Symbol (ES6+)<\/h3>\n

                      Represents a unique, immutable identifier.<\/p>\n

                      let id = Symbol(“userID”);<\/em>
                      \nlet id2 = Symbol(“userID”);<\/em>
                      \nconsole.log(id === id2); \/\/ false<\/em><\/p>\n

                      Use Case:<\/strong><\/p>\n

                        \n
                      • Creating unique property keys in objects to avoid name collisions.<\/li>\n<\/ul>\n

                        Bonus: BigInt (ES2020+)<\/strong><\/p>\n

                        For working with very large integers beyond Number.MAX_SAFE_INTEGER.<\/em><\/p>\n

                        let big = 1234567890123456789012345678901234567890n;<\/em><\/p>\n

                        Type Summary Table:<\/strong><\/p>\n\n\n\n\n\n\n\n\n\n\n\n
                        Type<\/th>\nExample<\/th>\ntypeof result<\/th>\n<\/tr>\n<\/thead>\n
                        Number<\/td>\n42, 3.14<\/td>\n“number”<\/td>\n<\/tr>\n
                        String<\/td>\n“hello”, ‘world’<\/td>\n“string”<\/td>\n<\/tr>\n
                        Boolean<\/td>\ntrue, false<\/td>\n“boolean”<\/td>\n<\/tr>\n
                        Null<\/td>\nnull<\/td>\n“object” (historical quirk)<\/span><\/td>\n<\/tr>\n
                        Undefined<\/td>\nundefined<\/td>\n“undefined”<\/td>\n<\/tr>\n
                        Symbol<\/td>\nSymbol(“id”)<\/td>\n“symbol”<\/td>\n<\/tr>\n
                        BigInt<\/td>\n123n<\/td>\n“bigint”<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

                        Operators: arithmetic, comparison, logical<\/h2>\n

                        1. Arithmetic Operators<\/h3>\n

                        Used to perform mathematical calculations.<\/p>\n\n\n\n\n\n\n\n\n\n\n\n\n
                        Operator<\/th>\nDescription<\/th>\nExample<\/th>\nResult<\/th>\n<\/tr>\n<\/thead>\n
                        +<\/td>\nAddition<\/td>\n5 + 2<\/td>\n7<\/td>\n<\/tr>\n
                        –<\/td>\nSubtraction<\/td>\n5 – 2<\/td>\n3<\/td>\n<\/tr>\n
                        *<\/td>\nMultiplication<\/td>\n5 * 2<\/td>\n10<\/td>\n<\/tr>\n
                        \/<\/td>\nDivision<\/td>\n5 \/ 2<\/td>\n2.5<\/td>\n<\/tr>\n
                        %<\/td>\nModulus (Remainder)<\/td>\n5 % 2<\/td>\n1<\/td>\n<\/tr>\n
                        **<\/td>\nExponentiation<\/td>\n5 ** 2<\/td>\n25<\/td>\n<\/tr>\n
                        ++<\/td>\nIncrement<\/td>\nlet x = 1; x++<\/td>\n2 (x becomes 2)<\/span><\/td>\n<\/tr>\n
                        —<\/td>\nDecrement<\/td>\nlet x = 2; x–<\/td>\n1 (x becomes 1)<\/span><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

                        Notes:<\/strong><\/p>\n

                          \n
                        • ++ and — have prefix and postfix forms.<\/li>\n<\/ul>\n

                          let a = 5;<\/em>
                          \nconsole.log(++a); \/\/ 6 (prefix: increment, then use)<\/em>
                          \nconsole.log(a++); \/\/ 6 (postfix: use, then increment)<\/em><\/p>\n

                          2. Comparison Operators<\/h3>\n

                          Used to compare values; result is always true or false.<\/p>\n\n\n\n\n\n\n\n\n\n\n\n\n
                          Operator<\/th>\nDescription<\/th>\nExample<\/th>\nResult<\/th>\n<\/tr>\n<\/thead>\n
                          ==<\/td>\nEqual to (loose)<\/td>\n5 == “5”<\/td>\ntrue<\/td>\n<\/tr>\n
                          ===<\/td>\nEqual to (strict)<\/td>\n5 === “5”<\/td>\nfalse<\/td>\n<\/tr>\n
                          !=<\/td>\nNot equal (loose)<\/td>\n5 != “5”<\/td>\nfalse<\/td>\n<\/tr>\n
                          !==<\/td>\nNot equal (strict)<\/td>\n5 !== “5”<\/td>\ntrue<\/td>\n<\/tr>\n
                          ><\/td>\nGreater than<\/td>\n5 > 2<\/td>\ntrue<\/td>\n<\/tr>\n
                          <<\/td>\nLess than<\/td>\n5 < 2<\/td>\nfalse<\/td>\n<\/tr>\n
                          >=<\/td>\nGreater than or equal to<\/td>\n5 >= 5<\/td>\ntrue<\/td>\n<\/tr>\n
                          <=<\/td>\nLess than or equal to<\/td>\n5 <= 4<\/td>\nfalse<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

                          Notes:<\/strong><\/p>\n

                          === and !== are preferred to avoid type coercion issues.<\/p>\n

                          0 == false \/\/ true<\/em>
                          \n0 === false \/\/ false<\/em><\/p>\n

                          3. Logical Operators<\/h3>\n

                          Used for combining boolean expressions.<\/p>\n\n\n\n\n\n\n\n
                          Operator<\/th>\nName<\/th>\nExample<\/th>\nResult<\/th>\n<\/tr>\n<\/thead>\n
                          &&<\/td>\nAND<\/td>\ntrue && false<\/td>\nfalse<\/td>\n<\/tr>\n
                          ||<\/td>\nOR<\/td>\ntrue || false<\/td>\ntrue<\/td>\n<\/tr>\n
                          !<\/td>\nNOT<\/td>\n!true<\/td>\nfalse<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

                          Truth Table for && and ||:<\/strong><\/p>\n\n\n\n\n\n\n\n\n
                          A<\/th>\nB<\/th>\nA && B (AND)<\/th>\nA || B (OR)<\/th>\n<\/tr>\n<\/thead>\n
                          true<\/td>\ntrue<\/td>\ntrue<\/td>\ntrue<\/td>\n<\/tr>\n
                          true<\/td>\nfalse<\/td>\nfalse<\/td>\ntrue<\/td>\n<\/tr>\n
                          false<\/td>\ntrue<\/td>\nfalse<\/td>\ntrue<\/td>\n<\/tr>\n
                          false<\/td>\nfalse<\/td>\nfalse<\/td>\nfalse<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

                          Notes:<\/strong><\/p>\n

                          Logical operators return the last evaluated value, not just true or false.<\/p>\n

                          let name = “”;<\/em>
                          \nlet username = name || “Guest”; \/\/ “Guest” because “” is falsy<\/em><\/p>\n

                          let isLoggedIn = true;<\/em>
                          \nisLoggedIn && console.log(“Welcome!”); \/\/ Logs only if true<\/em><\/p>\n

                          Bonus:<\/strong> Combined Example<\/p>\n

                          let age = 20;<\/em><\/p>\n

                          if (age >= 18 && age < 65) {<\/em>
                          \nconsole.log(“Adult”);<\/em>
                          \n} else if (age >= 65) {<\/em>
                          \nconsole.log(“Senior”);<\/em>
                          \n} else {<\/em>
                          \nconsole.log(“Minor”);<\/em>
                          \n}<\/em><\/p>\n

                          String concatenation and template literals<\/h2>\n

                          1. String Concatenation (Using + or +=)<\/h3>\n

                          This is the classic way of combining strings.<\/p>\n

                          let firstName = “John”;<\/em>
                          \nlet lastName = “Doe”;<\/em>
                          \nlet fullName = firstName + ” ” + lastName;<\/em>
                          \nconsole.log(fullName); \/\/ “John Doe”<\/em><\/p>\n

                          Concatenating Multiple Strings:<\/strong><\/p>\n

                          let msg = “Hello, ” + firstName + “! You have ” + 3 + ” new messages.”;<\/em><\/p>\n

                            \n
                          • Numbers are converted to strings automatically.<\/li>\n
                          • Can get messy with many variables or dynamic content.<\/li>\n<\/ul>\n

                            += Operator:<\/strong><\/p>\n

                            Used to append to a string:<\/strong><\/p>\n

                            let str = “Hello”;<\/em>
                            \nstr += ” world”;<\/em>
                            \nconsole.log(str); \/\/ “Hello world”<\/em><\/p>\n

                            2. Template Literals (ES6 Feature)<\/h3>\n

                            A modern, cleaner way to build strings using backticks ( ` ).<\/p>\n

                            let name = “Alice”;<\/em>
                            \nlet greeting = `Hello, ${name}!`;<\/em>
                            \nconsole.log(greeting); \/\/ “Hello, Alice!”<\/em><\/p>\n

                            Benefits:<\/strong><\/p>\n

                              \n
                            • Easier to insert variables.<\/li>\n
                            • Supports multiline strings.<\/li>\n
                            • More readable for dynamic content.<\/li>\n<\/ul>\n

                              3. Using Expressions Inside Template Literals<\/h3>\n

                              let a = 10, b = 5;<\/em>
                              \nlet result = `Sum of ${a} and ${b} is ${a + b}`;<\/em>
                              \nconsole.log(result); \/\/ “Sum of 10 and 5 is 15”<\/em><\/p>\n

                              4. Multiline Strings<\/h3>\n

                              With concatenation (old way):<\/strong><\/p>\n

                              let poem = “Roses are red,\\n” + <\/em>
                              \n“Violets are blue.”;<\/em><\/p>\n

                              With template literals:<\/strong><\/p>\n

                              let poem = `Roses are red,<\/em>
                              \nViolets are blue.`;<\/em><\/p>\n

                              Bonus: Preserves tabs and line breaks automatically.<\/p>\n

                              5. Example Comparison<\/h3>\n

                              Concatenation:<\/strong><\/p>\n

                              let user = “Jack”;<\/em>
                              \nlet age = 25;<\/em>
                              \nlet message = “User ” + user + ” is ” + age + ” years old.”;<\/em><\/p>\n

                              Template Literal:<\/strong><\/p>\n

                              let message = `User ${user} is ${age} years old.`;<\/em><\/p>\n

                              When to Use What?<\/strong><\/p>\n\n\n\n\n\n\n\n\n
                              Use Case<\/th>\nRecommended Approach<\/th>\n<\/tr>\n<\/thead>\n
                              Static text only<\/td>\nConcatenation<\/span> or string literals<\/span><\/p>\n
                              Example: ‘Hello ‘ + ‘World’ or ‘Hello World’<\/div>\n<\/td>\n<\/tr>\n
                              Dynamic + readable strings<\/td>\nTemplate literals<\/td>\n<\/tr>\n
                              Multiline strings<\/td>\nTemplate literals<\/td>\n<\/tr>\n
                              HTML templates<\/td>\nTemplate literals<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

                              Comments and code structure<\/h2>\n

                              1. Comments in JavaScript<\/h3>\n

                              Single-line Comments<\/strong><\/p>\n

                              Use \/\/ to write comments on a single line.<\/p>\n

                              \/\/ This is a single-line comment<\/em>
                              \nlet name = “Alice”; \/\/ This is also a valid comment<\/em><\/p>\n

                              Multi-line (Block) Comments<\/strong><\/p>\n

                              Use \/* *\/ for comments that span multiple lines.<\/p>\n

                              \/*<\/em>
                              \nThis is a multi-line comment.<\/em>
                              \nUseful for longer explanations.<\/em>
                              \n*\/<\/em>
                              \nlet age = 25;<\/em><\/p>\n

                              Use Comments To:<\/strong><\/p>\n

                                \n
                              • Explain why, not just what.<\/li>\n
                              • Document tricky logic.<\/li>\n
                              • Temporarily disable code (comment it out).<\/li>\n
                              • Label sections of code.<\/li>\n<\/ul>\n

                                2. Code Structure Basics<\/h3>\n

                                1. Declare Variables at the Top<\/strong><\/p>\n

                                Keeps data organized and easy to find.<\/p>\n

                                let userName = “Jane”;<\/em>
                                \nconst maxAttempts = 3;<\/em><\/p>\n

                                2. Use Functions to Organize Logic<\/strong><\/p>\n

                                Break your code into reusable blocks.<\/p>\n

                                function greetUser(name) {<\/em>
                                \nreturn `Hello, ${name}!`;<\/em>
                                \n}<\/em><\/p>\n

                                3. Group Related Code<\/strong><\/p>\n

                                Use spacing and comments to group by purpose.<\/p>\n

                                \/\/ — User Input —<\/em>
                                \nlet name = prompt(“Enter your name:”);<\/em><\/p>\n

                                \/\/ — Processing —<\/em>
                                \nlet greeting = `Hello, ${name}`;<\/em><\/p>\n

                                \/\/ — Output —<\/em>
                                \nalert(greeting);<\/em><\/p>\n

                                3. Indentation & Formatting<\/h3>\n

                                Consistent Indentation:<\/strong><\/p>\n

                                  \n
                                • Use 2 or 4 spaces, not tabs.<\/li>\n
                                • Nested blocks should be indented clearly.<\/li>\n<\/ul>\n

                                  if (isActive) {<\/em>
                                  \nconsole.log(“Active”);<\/em>
                                  \n} else {<\/em>
                                  \nconsole.log(“Inactive”);<\/em>
                                  \n}<\/em><\/p>\n

                                  Line Breaks & Spacing:<\/strong><\/p>\n

                                    \n
                                  • Add blank lines between logical sections.<\/li>\n
                                  • Keep lines under 80\u2013100 characters when possible.<\/li>\n<\/ul>\n

                                    4. Naming Conventions<\/h3>\n\n\n\n\n\n\n\n\n
                                    Item<\/th>\nConvention<\/th>\nExample<\/th>\n<\/tr>\n<\/thead>\n
                                    Variable<\/td>\ncamelCase<\/td>\nuserName<\/td>\n<\/tr>\n
                                    Constant<\/td>\nUPPER_SNAKE_CASE<\/td>\nMAX_USERS<\/td>\n<\/tr>\n
                                    Function<\/td>\ncamelCase<\/td>\ngetUserInfo()<\/td>\n<\/tr>\n
                                    Class<\/td>\nPascalCase<\/td>\nUserProfile<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

                                    5. Code Example with Comments & Structure<\/h3>\n

                                    \/\/ App configuration<\/em>
                                    \nconst MAX_SCORE = 100;<\/em><\/p>\n

                                    \/\/ — Input —<\/em>
                                    \nlet userName = prompt(“Enter your name:”);<\/em>
                                    \nlet score = parseInt(prompt(“Enter your score:”));<\/em><\/p>\n

                                    \/\/ — Logic —<\/em>
                                    \nfunction evaluateScore(score) {<\/em>
                                    \nif (score >= 90) {<\/em>
                                    \nreturn “Excellent”;<\/em>
                                    \n} else if (score >= 75) {<\/em>
                                    \nreturn “Good”;<\/em>
                                    \n} else {<\/em>
                                    \nreturn “Needs improvement”;<\/em>
                                    \n}<\/em>
                                    \n}<\/em><\/p>\n

                                    \/\/ — Output —<\/em>
                                    \nlet message = `${userName}, your result is: ${evaluateScore(score)}`;<\/em>
                                    \nalert(message);<\/em><\/p>\n

                                    Summary:<\/strong><\/p>\n\n\n\n\n\n\n\n\n\n
                                    Best Practice<\/th>\nTip<\/th>\n<\/tr>\n<\/thead>\n
                                    Use comments<\/td>\nTo explain “why”, not “what”
                                    \nGood: \/\/ Validate email format for security
                                    \nBad: \/\/ Checking email format<\/span><\/td>\n<\/tr>\n
                                    Group related logic<\/td>\nUsing whitespace and headers
                                    \nSeparate different functionality with blank lines<\/span><\/td>\n<\/tr>\n
                                    Keep it readable<\/td>\nUse consistent indentation
                                    \nChoose either tabs or spaces (2\/4 spaces recommended)<\/span><\/td>\n<\/tr>\n
                                    Break into functions<\/td>\nAvoid long procedural blocks
                                    \nFunctions should do one thing and do it well<\/span><\/td>\n<\/tr>\n
                                    Name things clearly<\/td>\nAvoid single-letter variables
                                    \nPrefer userCount<\/span> over c<\/span><\/span><\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

                                    Want help applying this to a small project or code refactor?<\/p>\n","protected":false},"excerpt":{"rendered":"

                                    Variables (let, const, var) 1. What Are Variables? Variables store data values that can be used and manipulated in your code. let name = “Alice”; const age = 30; var city = “Paris”; 2. let \u2013 Block-scoped, Reassignable Introduced in ES6 (2015), let is the<\/p>\n","protected":false},"author":1,"featured_media":544,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[13],"tags":[],"class_list":["post-543","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-java-script"],"yoast_head":"\nBasics and Syntax - Java Script Course<\/title>\n<meta name=\"description\" content=\"JavaScript basics and syntax provide the foundational rules and structure for writing and organizing code to create dynamic web behavior.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/buhave.com\/courses\/java-script\/basics-and-syntax\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Basics and Syntax - Java Script Course\" \/>\n<meta property=\"og:description\" content=\"JavaScript basics and syntax provide the foundational rules and structure for writing and organizing code to create dynamic web behavior.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/buhave.com\/courses\/java-script\/basics-and-syntax\/\" \/>\n<meta property=\"og:site_name\" content=\"BUHAVE\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/BeYouHave\/\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/naveedsafdarawan\/\" \/>\n<meta property=\"article:published_time\" content=\"2025-05-19T11:04:22+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-05-20T12:57:18+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/buhave.com\/courses\/wp-content\/uploads\/2025\/04\/Basics-and-Syntax.webp\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"628\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/webp\" \/>\n<meta name=\"author\" content=\"Naveed Safdar\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Naveed Safdar\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"7 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/buhave.com\\\/courses\\\/java-script\\\/basics-and-syntax\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/buhave.com\\\/courses\\\/java-script\\\/basics-and-syntax\\\/\"},\"author\":{\"name\":\"Naveed Safdar\",\"@id\":\"https:\\\/\\\/buhave.com\\\/courses\\\/#\\\/schema\\\/person\\\/04fe0254e118521c9fbb3da39de5acca\"},\"headline\":\"Basics and Syntax\",\"datePublished\":\"2025-05-19T11:04:22+00:00\",\"dateModified\":\"2025-05-20T12:57:18+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/buhave.com\\\/courses\\\/java-script\\\/basics-and-syntax\\\/\"},\"wordCount\":1374,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/buhave.com\\\/courses\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/buhave.com\\\/courses\\\/java-script\\\/basics-and-syntax\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/buhave.com\\\/courses\\\/wp-content\\\/uploads\\\/2025\\\/04\\\/Basics-and-Syntax.webp\",\"articleSection\":[\"Java Script Course\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/buhave.com\\\/courses\\\/java-script\\\/basics-and-syntax\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/buhave.com\\\/courses\\\/java-script\\\/basics-and-syntax\\\/\",\"url\":\"https:\\\/\\\/buhave.com\\\/courses\\\/java-script\\\/basics-and-syntax\\\/\",\"name\":\"Basics and Syntax - Java Script Course\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/buhave.com\\\/courses\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/buhave.com\\\/courses\\\/java-script\\\/basics-and-syntax\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/buhave.com\\\/courses\\\/java-script\\\/basics-and-syntax\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/buhave.com\\\/courses\\\/wp-content\\\/uploads\\\/2025\\\/04\\\/Basics-and-Syntax.webp\",\"datePublished\":\"2025-05-19T11:04:22+00:00\",\"dateModified\":\"2025-05-20T12:57:18+00:00\",\"description\":\"JavaScript basics and syntax provide the foundational rules and structure for writing and organizing code to create dynamic web behavior.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/buhave.com\\\/courses\\\/java-script\\\/basics-and-syntax\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/buhave.com\\\/courses\\\/java-script\\\/basics-and-syntax\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/buhave.com\\\/courses\\\/java-script\\\/basics-and-syntax\\\/#primaryimage\",\"url\":\"https:\\\/\\\/buhave.com\\\/courses\\\/wp-content\\\/uploads\\\/2025\\\/04\\\/Basics-and-Syntax.webp\",\"contentUrl\":\"https:\\\/\\\/buhave.com\\\/courses\\\/wp-content\\\/uploads\\\/2025\\\/04\\\/Basics-and-Syntax.webp\",\"width\":1200,\"height\":628,\"caption\":\"Basics and Syntax\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/buhave.com\\\/courses\\\/java-script\\\/basics-and-syntax\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Courses\",\"item\":\"https:\\\/\\\/buhave.com\\\/courses\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Java Script Course\",\"item\":\"https:\\\/\\\/buhave.com\\\/courses\\\/learn\\\/java-script\\\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Basics and Syntax\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/buhave.com\\\/courses\\\/#website\",\"url\":\"https:\\\/\\\/buhave.com\\\/courses\\\/\",\"name\":\"BUHAVE\",\"description\":\"Courses - Learn Online for Free\",\"publisher\":{\"@id\":\"https:\\\/\\\/buhave.com\\\/courses\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/buhave.com\\\/courses\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/buhave.com\\\/courses\\\/#organization\",\"name\":\"BUHAVE\",\"url\":\"https:\\\/\\\/buhave.com\\\/courses\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/buhave.com\\\/courses\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/buhave.com\\\/courses\\\/wp-content\\\/uploads\\\/2025\\\/03\\\/buhave-course.webp\",\"contentUrl\":\"https:\\\/\\\/buhave.com\\\/courses\\\/wp-content\\\/uploads\\\/2025\\\/03\\\/buhave-course.webp\",\"width\":375,\"height\":75,\"caption\":\"BUHAVE\"},\"image\":{\"@id\":\"https:\\\/\\\/buhave.com\\\/courses\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/BeYouHave\\\/\",\"https:\\\/\\\/www.linkedin.com\\\/company\\\/buhave\",\"https:\\\/\\\/www.youtube.com\\\/@buhave\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/buhave.com\\\/courses\\\/#\\\/schema\\\/person\\\/04fe0254e118521c9fbb3da39de5acca\",\"name\":\"Naveed Safdar\",\"description\":\"I\u2019m Naveed Safdar - SEO Manager with over 10 years of experience in SEO and Digital Marketing. I\u2019ve had the privilege of working with leading national and international companies including Grafdom, PakWheels, Systems Limited, Confiz, Educative, and Dubizzle Labs. My expertise spans technical SEO, content strategy, organic growth, and performance analytics - helping businesses improve visibility, traffic, and ROI.\",\"sameAs\":[\"https:\\\/\\\/www.linkedin.com\\\/in\\\/naveedsafdar\\\/\",\"https:\\\/\\\/www.facebook.com\\\/naveedsafdarawan\\\/\",\"https:\\\/\\\/www.youtube.com\\\/@naveedsafdar\"],\"url\":\"https:\\\/\\\/buhave.com\\\/courses\\\/author\\\/naveed-safdar\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Basics and Syntax - Java Script Course","description":"JavaScript basics and syntax provide the foundational rules and structure for writing and organizing code to create dynamic web behavior.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/buhave.com\/courses\/java-script\/basics-and-syntax\/","og_locale":"en_US","og_type":"article","og_title":"Basics and Syntax - Java Script Course","og_description":"JavaScript basics and syntax provide the foundational rules and structure for writing and organizing code to create dynamic web behavior.","og_url":"https:\/\/buhave.com\/courses\/java-script\/basics-and-syntax\/","og_site_name":"BUHAVE","article_publisher":"https:\/\/www.facebook.com\/BeYouHave\/","article_author":"https:\/\/www.facebook.com\/naveedsafdarawan\/","article_published_time":"2025-05-19T11:04:22+00:00","article_modified_time":"2025-05-20T12:57:18+00:00","og_image":[{"width":1200,"height":628,"url":"https:\/\/buhave.com\/courses\/wp-content\/uploads\/2025\/04\/Basics-and-Syntax.webp","type":"image\/webp"}],"author":"Naveed Safdar","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Naveed Safdar","Est. reading time":"7 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/buhave.com\/courses\/java-script\/basics-and-syntax\/#article","isPartOf":{"@id":"https:\/\/buhave.com\/courses\/java-script\/basics-and-syntax\/"},"author":{"name":"Naveed Safdar","@id":"https:\/\/buhave.com\/courses\/#\/schema\/person\/04fe0254e118521c9fbb3da39de5acca"},"headline":"Basics and Syntax","datePublished":"2025-05-19T11:04:22+00:00","dateModified":"2025-05-20T12:57:18+00:00","mainEntityOfPage":{"@id":"https:\/\/buhave.com\/courses\/java-script\/basics-and-syntax\/"},"wordCount":1374,"commentCount":0,"publisher":{"@id":"https:\/\/buhave.com\/courses\/#organization"},"image":{"@id":"https:\/\/buhave.com\/courses\/java-script\/basics-and-syntax\/#primaryimage"},"thumbnailUrl":"https:\/\/buhave.com\/courses\/wp-content\/uploads\/2025\/04\/Basics-and-Syntax.webp","articleSection":["Java Script Course"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/buhave.com\/courses\/java-script\/basics-and-syntax\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/buhave.com\/courses\/java-script\/basics-and-syntax\/","url":"https:\/\/buhave.com\/courses\/java-script\/basics-and-syntax\/","name":"Basics and Syntax - Java Script Course","isPartOf":{"@id":"https:\/\/buhave.com\/courses\/#website"},"primaryImageOfPage":{"@id":"https:\/\/buhave.com\/courses\/java-script\/basics-and-syntax\/#primaryimage"},"image":{"@id":"https:\/\/buhave.com\/courses\/java-script\/basics-and-syntax\/#primaryimage"},"thumbnailUrl":"https:\/\/buhave.com\/courses\/wp-content\/uploads\/2025\/04\/Basics-and-Syntax.webp","datePublished":"2025-05-19T11:04:22+00:00","dateModified":"2025-05-20T12:57:18+00:00","description":"JavaScript basics and syntax provide the foundational rules and structure for writing and organizing code to create dynamic web behavior.","breadcrumb":{"@id":"https:\/\/buhave.com\/courses\/java-script\/basics-and-syntax\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/buhave.com\/courses\/java-script\/basics-and-syntax\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/buhave.com\/courses\/java-script\/basics-and-syntax\/#primaryimage","url":"https:\/\/buhave.com\/courses\/wp-content\/uploads\/2025\/04\/Basics-and-Syntax.webp","contentUrl":"https:\/\/buhave.com\/courses\/wp-content\/uploads\/2025\/04\/Basics-and-Syntax.webp","width":1200,"height":628,"caption":"Basics and Syntax"},{"@type":"BreadcrumbList","@id":"https:\/\/buhave.com\/courses\/java-script\/basics-and-syntax\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Courses","item":"https:\/\/buhave.com\/courses\/"},{"@type":"ListItem","position":2,"name":"Java Script Course","item":"https:\/\/buhave.com\/courses\/learn\/java-script\/"},{"@type":"ListItem","position":3,"name":"Basics and Syntax"}]},{"@type":"WebSite","@id":"https:\/\/buhave.com\/courses\/#website","url":"https:\/\/buhave.com\/courses\/","name":"BUHAVE","description":"Courses - Learn Online for Free","publisher":{"@id":"https:\/\/buhave.com\/courses\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/buhave.com\/courses\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/buhave.com\/courses\/#organization","name":"BUHAVE","url":"https:\/\/buhave.com\/courses\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/buhave.com\/courses\/#\/schema\/logo\/image\/","url":"https:\/\/buhave.com\/courses\/wp-content\/uploads\/2025\/03\/buhave-course.webp","contentUrl":"https:\/\/buhave.com\/courses\/wp-content\/uploads\/2025\/03\/buhave-course.webp","width":375,"height":75,"caption":"BUHAVE"},"image":{"@id":"https:\/\/buhave.com\/courses\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/BeYouHave\/","https:\/\/www.linkedin.com\/company\/buhave","https:\/\/www.youtube.com\/@buhave"]},{"@type":"Person","@id":"https:\/\/buhave.com\/courses\/#\/schema\/person\/04fe0254e118521c9fbb3da39de5acca","name":"Naveed Safdar","description":"I\u2019m Naveed Safdar - SEO Manager with over 10 years of experience in SEO and Digital Marketing. I\u2019ve had the privilege of working with leading national and international companies including Grafdom, PakWheels, Systems Limited, Confiz, Educative, and Dubizzle Labs. My expertise spans technical SEO, content strategy, organic growth, and performance analytics - helping businesses improve visibility, traffic, and ROI.","sameAs":["https:\/\/www.linkedin.com\/in\/naveedsafdar\/","https:\/\/www.facebook.com\/naveedsafdarawan\/","https:\/\/www.youtube.com\/@naveedsafdar"],"url":"https:\/\/buhave.com\/courses\/author\/naveed-safdar\/"}]}},"_links":{"self":[{"href":"https:\/\/buhave.com\/courses\/wp-json\/wp\/v2\/posts\/543","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/buhave.com\/courses\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/buhave.com\/courses\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/buhave.com\/courses\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/buhave.com\/courses\/wp-json\/wp\/v2\/comments?post=543"}],"version-history":[{"count":1,"href":"https:\/\/buhave.com\/courses\/wp-json\/wp\/v2\/posts\/543\/revisions"}],"predecessor-version":[{"id":545,"href":"https:\/\/buhave.com\/courses\/wp-json\/wp\/v2\/posts\/543\/revisions\/545"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/buhave.com\/courses\/wp-json\/wp\/v2\/media\/544"}],"wp:attachment":[{"href":"https:\/\/buhave.com\/courses\/wp-json\/wp\/v2\/media?parent=543"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/buhave.com\/courses\/wp-json\/wp\/v2\/categories?post=543"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/buhave.com\/courses\/wp-json\/wp\/v2\/tags?post=543"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}