Skip to content

Instantly share code, notes, and snippets.

/index.html

Created December 1, 2016 02:15
Show Gist options
  • Save anonymous/e073b322681f8c7d98d60068b60e785c to your computer and use it in GitHub Desktop.
Save anonymous/e073b322681f8c7d98d60068b60e785c to your computer and use it in GitHub Desktop.
Download ZIP
Variables Variables studies // source https://jsbin.com/varegek
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="Variables studies">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Variables</title>
</head>
<body>
<script id="jsbin-javascript">
// -----Variables definition----- //
/* In Javascript, Variables are empty containers used
for storing data values. All variables must be identified using unique names:
Ex. uniName
Variables are bound to the scope in which they declared,
and variable names can contain letters, digits, underscores,
and dollar signs; however, they must begin with a letter,
though Javascript will allow names to begin with an _ or $. */
// -----How to Use a Variable------ //
/* Javascript must use variables to hold values in memory.
"Declaring" a variable is the act of naming a variable
using the keyward var followed by the name: */
"use strict";
var exampleVar;
console.log(exampleVar); // = logs undefined
/* When naming variables, it is best practice to use camelCase.
exampleVar is now held in memory with a value of
undefined. To assign a value to exampleVar, follow the same
declaration pattern followed by the assignment operator, the
value,and a semi-colon. Declaring and assigning in a single
line is also called "initializing." */
var exampleVar2 = "I'm the value!"; // initializing
console.log(exampleVar2); // logs "I'm the value!"
/* Variables can also have their values reassigned
after declaration without the need to repeat the var keyword: */
var exampleVar3; // undefined
exampleVar3 = "I was undefined a line ago!"; // assigned!
console.log(exampleVar3);
/* Other keywords exist that can be used in place of var
for contextual reasons. The const keyword creates a variable
whose value cannot be reassigned (immutable). This implies that
the value is not meant to be reassigned and will appear
throughout the code. The contents of a const's value, however,
can be altered (mutable): */
var exampleConst = "I can't be redeclared!";
console.log(exampleConst);
var exampleConst2 = {}; // values within object can be altered!
console.log(exampleConst2); // returns empty object
exampleConst2.alteredValue = "I'm new!"; // adding value to {}
console.log(exampleConst2); // now has one key/value pair
/* The keyword let has the implication that the variable
will only be used within a local or limited scope and will
more than likely not reappear elsewhere. Using let within a
for-loop is example of a variable that does not need to exist
outside of the loop: */
for (var i = 0; i < exampleVar2; i++) {} // i has temporary
// usage.
/* All three keywords establish themselves within a specific
scope. Scope refers to the visibility of variables, including
global scope, local scope, and within individual blocks of
code. */
/* Keyword var creates a variable that can exist in the global
scope or the local scope, depending upon whether it is declared
independent of a function, array, or object; otherwise, it will
exist in the local scope of the function, array, or object
in which it was declared. If locally declared, it will be
accessable throughout a function, for example. A var variable is
hoisted to the beginning of the code, though its value will
contain undefined until the code has sequentially reached the
line on which it is assignment. */
/* Keyword const is block-scoped, meaning it cannot be accessed
in the scope above the one in which it was declared or, within
functions, outside of the block of code in which it exists. A
const variable is hoisted to the top of the global scope like
var. The keyword let is also block-scoped and will only be
hoisted to the top of the code-block. */
// -----Hoisting examples----- //
console.log(hoExample); // variable exists, undefined yet
console.log(hoExample2); // exists, throws "undefined" error
var hoExample = "I exist right... now!";
console.log(hoExample); // now has a value
var hoExample2 = "Existiiing... now!";
console.log(hoExample2); // now has a value, too
function hoExVar() {
var localVar = "I don't exist in global";
console.log(localVar); // can access this nested var
}
console.log(localVar); // cannot access this nested var,
// will result in error that may stop code
console.log(hoExVar());
function hoExVar2() {
var stillLocal = "I exist in all of hoExVar2";
function nested() {
var blockScopedCon = "I exist within this anonymous function";
var blockScopedLet = "I exist within this anonymous function";
}
console.log(stillLocal); //returns "I exist in all..."
console.log(blockScopedCon); //returns error, stops code
console.log(blockScopedLet); //returns error, stops code
}
console.log(hoExVar2());
// -----The Importance of Variables----- //
/* Variables serve the purpose of containing values within
memory so they can be accessed later one. They also provide
contextual names for the values that helps with establishing
clarity of the code for the programmers. Lastly, variables
allow us to access these values multiple times without having
to hard-code, allowing for more flexibility and a
bare-minimum amount of repetitive code. */
</script>
<script id="jsbin-source-javascript" type="text/javascript">// -----Variables definition----- //
/* In Javascript, Variables are empty containers used
for storing data values. All variables must be identified using unique names:
Ex. uniName
Variables are bound to the scope in which they declared,
and variable names can contain letters, digits, underscores,
and dollar signs; however, they must begin with a letter,
though Javascript will allow names to begin with an _ or $. */
// -----How to Use a Variable------ //
/* Javascript must use variables to hold values in memory.
"Declaring" a variable is the act of naming a variable
using the keyward var followed by the name: */
var exampleVar;
console.log(exampleVar); // = logs undefined
/* When naming variables, it is best practice to use camelCase.
exampleVar is now held in memory with a value of
undefined. To assign a value to exampleVar, follow the same
declaration pattern followed by the assignment operator, the
value,and a semi-colon. Declaring and assigning in a single
line is also called "initializing." */
var exampleVar2 = "I'm the value!"; // initializing
console.log(exampleVar2); // logs "I'm the value!"
/* Variables can also have their values reassigned
after declaration without the need to repeat the var keyword: */
var exampleVar3; // undefined
exampleVar3 = "I was undefined a line ago!"; // assigned!
console.log(exampleVar3);
/* Other keywords exist that can be used in place of var
for contextual reasons. The const keyword creates a variable
whose value cannot be reassigned (immutable). This implies that
the value is not meant to be reassigned and will appear
throughout the code. The contents of a const's value, however,
can be altered (mutable): */
const exampleConst = "I can't be redeclared!"
console.log(exampleConst);
const exampleConst2 = {}; // values within object can be altered!
console.log(exampleConst2); // returns empty object
exampleConst2.alteredValue = "I'm new!"; // adding value to {}
console.log(exampleConst2); // now has one key/value pair
/* The keyword let has the implication that the variable
will only be used within a local or limited scope and will
more than likely not reappear elsewhere. Using let within a
for-loop is example of a variable that does not need to exist
outside of the loop: */
for (let i = 0; i < exampleVar2; i++) {} // i has temporary
// usage.
/* All three keywords establish themselves within a specific
scope. Scope refers to the visibility of variables, including
global scope, local scope, and within individual blocks of
code. */
/* Keyword var creates a variable that can exist in the global
scope or the local scope, depending upon whether it is declared
independent of a function, array, or object; otherwise, it will
exist in the local scope of the function, array, or object
in which it was declared. If locally declared, it will be
accessable throughout a function, for example. A var variable is
hoisted to the beginning of the code, though its value will
contain undefined until the code has sequentially reached the
line on which it is assignment. */
/* Keyword const is block-scoped, meaning it cannot be accessed
in the scope above the one in which it was declared or, within
functions, outside of the block of code in which it exists. A
const variable is hoisted to the top of the global scope like
var. The keyword let is also block-scoped and will only be
hoisted to the top of the code-block. */
// -----Hoisting examples----- //
console.log(hoExample); // variable exists, undefined yet
console.log(hoExample2); // exists, throws "undefined" error
var hoExample = "I exist right... now!";
console.log(hoExample); // now has a value
const hoExample2 = "Existiiing... now!";
console.log(hoExample2); // now has a value, too
function hoExVar() {
var localVar = "I don't exist in global"
console.log(localVar); // can access this nested var
}
console.log(localVar); // cannot access this nested var,
// will result in error that may stop code
console.log(hoExVar());
function hoExVar2() {
var stillLocal = "I exist in all of hoExVar2"
function nested() {
const blockScopedCon = "I exist within this anonymous function";
let blockScopedLet = "I exist within this anonymous function";
}
console.log(stillLocal); //returns "I exist in all..."
console.log(blockScopedCon); //returns error, stops code
console.log(blockScopedLet); //returns error, stops code
}
console.log(hoExVar2());
// -----The Importance of Variables----- //
/* Variables serve the purpose of containing values within
memory so they can be accessed later one. They also provide
contextual names for the values that helps with establishing
clarity of the code for the programmers. Lastly, variables
allow us to access these values multiple times without having
to hard-code, allowing for more flexibility and a
bare-minimum amount of repetitive code. */
</script></body>
</html>
Raw
jsbin.varegek.js
// -----Variables definition----- //
/* In Javascript, Variables are empty containers used
for storing data values. All variables must be identified using unique names:
Ex. uniName
Variables are bound to the scope in which they declared,
and variable names can contain letters, digits, underscores,
and dollar signs; however, they must begin with a letter,
though Javascript will allow names to begin with an _ or $. */
// -----How to Use a Variable------ //
/* Javascript must use variables to hold values in memory.
"Declaring" a variable is the act of naming a variable
using the keyward var followed by the name: */
"use strict";
var exampleVar;
console.log(exampleVar); // = logs undefined
/* When naming variables, it is best practice to use camelCase.
exampleVar is now held in memory with a value of
undefined. To assign a value to exampleVar, follow the same
declaration pattern followed by the assignment operator, the
value,and a semi-colon. Declaring and assigning in a single
line is also called "initializing." */
var exampleVar2 = "I'm the value!"; // initializing
console.log(exampleVar2); // logs "I'm the value!"
/* Variables can also have their values reassigned
after declaration without the need to repeat the var keyword: */
var exampleVar3; // undefined
exampleVar3 = "I was undefined a line ago!"; // assigned!
console.log(exampleVar3);
/* Other keywords exist that can be used in place of var
for contextual reasons. The const keyword creates a variable
whose value cannot be reassigned (immutable). This implies that
the value is not meant to be reassigned and will appear
throughout the code. The contents of a const's value, however,
can be altered (mutable): */
var exampleConst = "I can't be redeclared!";
console.log(exampleConst);
var exampleConst2 = {}; // values within object can be altered!
console.log(exampleConst2); // returns empty object
exampleConst2.alteredValue = "I'm new!"; // adding value to {}
console.log(exampleConst2); // now has one key/value pair
/* The keyword let has the implication that the variable
will only be used within a local or limited scope and will
more than likely not reappear elsewhere. Using let within a
for-loop is example of a variable that does not need to exist
outside of the loop: */
for (var i = 0; i < exampleVar2; i++) {} // i has temporary
// usage.
/* All three keywords establish themselves within a specific
scope. Scope refers to the visibility of variables, including
global scope, local scope, and within individual blocks of
code. */
/* Keyword var creates a variable that can exist in the global
scope or the local scope, depending upon whether it is declared
independent of a function, array, or object; otherwise, it will
exist in the local scope of the function, array, or object
in which it was declared. If locally declared, it will be
accessable throughout a function, for example. A var variable is
hoisted to the beginning of the code, though its value will
contain undefined until the code has sequentially reached the
line on which it is assignment. */
/* Keyword const is block-scoped, meaning it cannot be accessed
in the scope above the one in which it was declared or, within
functions, outside of the block of code in which it exists. A
const variable is hoisted to the top of the global scope like
var. The keyword let is also block-scoped and will only be
hoisted to the top of the code-block. */
// -----Hoisting examples----- //
console.log(hoExample); // variable exists, undefined yet
console.log(hoExample2); // exists, throws "undefined" error
var hoExample = "I exist right... now!";
console.log(hoExample); // now has a value
var hoExample2 = "Existiiing... now!";
console.log(hoExample2); // now has a value, too
function hoExVar() {
var localVar = "I don't exist in global";
console.log(localVar); // can access this nested var
}
console.log(localVar); // cannot access this nested var,
// will result in error that may stop code
console.log(hoExVar());
function hoExVar2() {
var stillLocal = "I exist in all of hoExVar2";
function nested() {
var blockScopedCon = "I exist within this anonymous function";
var blockScopedLet = "I exist within this anonymous function";
}
console.log(stillLocal); //returns "I exist in all..."
console.log(blockScopedCon); //returns error, stops code
console.log(blockScopedLet); //returns error, stops code
}
console.log(hoExVar2());
// -----The Importance of Variables----- //
/* Variables serve the purpose of containing values within
memory so they can be accessed later one. They also provide
contextual names for the values that helps with establishing
clarity of the code for the programmers. Lastly, variables
allow us to access these values multiple times without having
to hard-code, allowing for more flexibility and a
bare-minimum amount of repetitive code. */
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment