From 038230240b1e7271a392ec6f3f55be29d5684967 Mon Sep 17 00:00:00 2001 From: Markus Amalthea Magnuson Date: Thu, 14 Mar 2013 20:16:05 +0100 Subject: [PATCH 1/3] Remove trailing whitespace. --- page/javascript-101.md | 2 +- page/javascript-101/arrays.md | 6 +++--- page/javascript-101/closures.md | 8 ++++---- page/javascript-101/conditional-code.md | 2 +- page/javascript-101/functions.md | 2 +- page/javascript-101/getting-started.md | 8 ++++---- page/javascript-101/loops.md | 2 +- page/javascript-101/objects.md | 2 +- page/javascript-101/operators.md | 2 +- page/javascript-101/running-code.md | 11 ++--------- page/javascript-101/testing-type.md | 2 +- page/javascript-101/this-keyword.md | 2 +- page/javascript-101/types.md | 6 +++--- 13 files changed, 24 insertions(+), 31 deletions(-) diff --git a/page/javascript-101.md b/page/javascript-101.md index a74874b7..abcbc30b 100644 --- a/page/javascript-101.md +++ b/page/javascript-101.md @@ -2,7 +2,7 @@ title : JavaScript 101 level: beginner source: http://jqfundamentals.com/legacy -attribution: +attribution: - jQuery Fundamentals customFields: - diff --git a/page/javascript-101/arrays.md b/page/javascript-101/arrays.md index 507c62cb..9903b870 100644 --- a/page/javascript-101/arrays.md +++ b/page/javascript-101/arrays.md @@ -2,7 +2,7 @@ title: Arrays level: beginner source: http://jqfundamentals.com/legacy -attribution: +attribution: - jQuery Fundamentals --- Arrays are zero-indexed, ordered lists of values. They are a handy way to store a set of related items of the same type (such as strings), though in reality, an array can include multiple types of items, including other arrays. @@ -11,9 +11,9 @@ To create an array, either use the object constructor or the literal declaration ``` // A simple array with constructor -var myArray1 = new Array( "hello", "world" ); +var myArray1 = new Array( "hello", "world" ); // literal declaration, the preferred way -var myArray2 = [ "hello", "world" ]; +var myArray2 = [ "hello", "world" ]; ``` The literal declaration is generally preferred. See the [Google Coding Guidelines](http://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml#Array_and_Object_literals) for more information. diff --git a/page/javascript-101/closures.md b/page/javascript-101/closures.md index 00891849..1c929127 100644 --- a/page/javascript-101/closures.md +++ b/page/javascript-101/closures.md @@ -2,7 +2,7 @@ title: Closures level: beginner source: http://jqfundamentals.com/legacy -attribution: +attribution: - jQuery Fundamentals --- @@ -11,7 +11,7 @@ Closures are an extension of the concept of scope. With closures, functions have As shown in the [Functions](/functions) section, functions have access to changing variable values. The same sort of behavior exists with functions defined within loops — the function "sees" the change in the variable's value even after the function is defined, resulting in each function referencing the last value stored in the variable. ``` -// Each function executed within the loop will reference +// Each function executed within the loop will reference // the last value stored in i (5). // this won't behave as we want it to - // every 100 milliseconds, 5 will alert @@ -78,7 +78,7 @@ outerObj.outerFunction(); ``` ## `Function.bind` -Closures can be particularly useful when dealing with callbacks. However, it is often better to use `Function.bind`, which will avoid any overhead associated with scope traversal. +Closures can be particularly useful when dealing with callbacks. However, it is often better to use `Function.bind`, which will avoid any overhead associated with scope traversal. `Function.bind` is used to create a new function. When called, the new function then calls itself in the context of the supplied `this` value, using a given set of arguments that will precede any arguments provided when the new function was initially called. @@ -138,7 +138,7 @@ var module = { }; -// module.getUser() is called where "module" is "this" +// module.getUser() is called where "module" is "this" // and "module.user" is returned. // janedoe diff --git a/page/javascript-101/conditional-code.md b/page/javascript-101/conditional-code.md index bc336843..12bb7022 100644 --- a/page/javascript-101/conditional-code.md +++ b/page/javascript-101/conditional-code.md @@ -2,7 +2,7 @@ title: Conditional Code level: beginner source: http://jqfundamentals.com/legacy -attribution: +attribution: - jQuery Fundamentals --- Sometimes a block of code should only be run under certain conditions. Flow control — via `if` and `else` blocks — lets you run code if certain conditions have been met. diff --git a/page/javascript-101/functions.md b/page/javascript-101/functions.md index 96d75b6b..aec58bd0 100644 --- a/page/javascript-101/functions.md +++ b/page/javascript-101/functions.md @@ -2,7 +2,7 @@ title: Functions level: beginner source: http://jqfundamentals.com/legacy -attribution: +attribution: - jQuery Fundamentals --- diff --git a/page/javascript-101/getting-started.md b/page/javascript-101/getting-started.md index b760799a..217ae429 100644 --- a/page/javascript-101/getting-started.md +++ b/page/javascript-101/getting-started.md @@ -2,7 +2,7 @@ title: Getting Started level: Beginner source: http://jqfundamentals.com/legacy -attribution: +attribution: - jQuery Fundamentals --- @@ -38,10 +38,10 @@ Look at this simple HTML page that includes CSS and JavaScript to see how it all -``` - - - - - - - +``` \ No newline at end of file diff --git a/page/javascript-101/testing-type.md b/page/javascript-101/testing-type.md index 088fa6a9..11d299aa 100644 --- a/page/javascript-101/testing-type.md +++ b/page/javascript-101/testing-type.md @@ -2,7 +2,7 @@ title: Testing Type level: beginner source: http://jqfundamentals.com/legacy -attribution: +attribution: - jQuery Fundamentals --- diff --git a/page/javascript-101/this-keyword.md b/page/javascript-101/this-keyword.md index b60f3e27..30f5a9c9 100644 --- a/page/javascript-101/this-keyword.md +++ b/page/javascript-101/this-keyword.md @@ -2,7 +2,7 @@ title: The "this" Keyword level: beginner source: http://jqfundamentals.com/legacy -attribution: +attribution: - jQuery Fundamentals --- diff --git a/page/javascript-101/types.md b/page/javascript-101/types.md index 0391da55..a5cf60f2 100644 --- a/page/javascript-101/types.md +++ b/page/javascript-101/types.md @@ -2,7 +2,7 @@ title: Types level: beginner source: http://jqfundamentals.com/legacy -attribution: +attribution: - jQuery Fundamentals --- @@ -148,7 +148,7 @@ alert( bar[0] ); alert( bar.length ); ``` -An array can be manipulated through methods that are available on the instance of the array. Items in the array can be accessed using bracket notation with a given index. If the index does not exist or contains no value, the return type will be undefined. +An array can be manipulated through methods that are available on the instance of the array. Items in the array can be accessed using bracket notation with a given index. If the index does not exist or contains no value, the return type will be undefined. A few common array methods are shown below: @@ -205,7 +205,7 @@ typeof myValue === "number"; // false typeof myValue === "undefined"; // false -typeof myValue === "boolean"; +typeof myValue === "boolean"; // Using strict equality operator to check for null // false From 249f92b2f9d8b4734cc337b7615375c6510345cd Mon Sep 17 00:00:00 2001 From: Markus Amalthea Magnuson Date: Thu, 14 Mar 2013 22:38:10 +0100 Subject: [PATCH 2/3] Code style adherence. * Spaces to tabs. * Whitespace inside parentheses etc. * Insertion and removal of empty lines for spacing. * Comment reflow. * Remove a few redundant code blocks. --- page/javascript-101.md | 3 +- page/javascript-101/arrays.md | 20 ++-- page/javascript-101/closures.md | 123 ++++++++++-------------- page/javascript-101/conditional-code.md | 75 ++++++--------- page/javascript-101/functions.md | 66 ++++++------- page/javascript-101/getting-started.md | 42 ++++---- page/javascript-101/loops.md | 68 +++++-------- page/javascript-101/objects.md | 18 ++-- page/javascript-101/operators.md | 23 ++--- page/javascript-101/running-code.md | 39 ++++---- page/javascript-101/scope.md | 87 ++++++++--------- page/javascript-101/syntax-basics.md | 8 +- page/javascript-101/testing-type.md | 16 ++- page/javascript-101/this-keyword.md | 48 ++++----- page/javascript-101/types.md | 65 +++++-------- 15 files changed, 307 insertions(+), 394 deletions(-) diff --git a/page/javascript-101.md b/page/javascript-101.md index abcbc30b..66abdea7 100644 --- a/page/javascript-101.md +++ b/page/javascript-101.md @@ -10,7 +10,8 @@ customFields: value: "pencil" --- -##Introduction +## Introduction + So you want to unlock the power of jQuery to make the web a better place? Awesome, but there are a few things you should know about JavaScript first. Introduced at the dawn of the web, [JavaScript](http://en.wikipedia.org/wiki/JavaScript) is a powerful and expressive language that runs inside the browser in conjunction with HTML and CSS. Based on an open standard called [ECMAScript](http://en.wikipedia.org/wiki/ECMAScript), JavaScript has quickly become the "programming language of the web". All the power of jQuery is accessed via JavaScript, so needless to say, it's an important language to learn. Having a basic knowledge of JavaScript will go a long way in understanding, structuring and debugging your code. diff --git a/page/javascript-101/arrays.md b/page/javascript-101/arrays.md index 9903b870..592422e6 100644 --- a/page/javascript-101/arrays.md +++ b/page/javascript-101/arrays.md @@ -10,9 +10,9 @@ Arrays are zero-indexed, ordered lists of values. They are a handy way to store To create an array, either use the object constructor or the literal declaration, by assigning the variable a list of values after the declaration. ``` -// A simple array with constructor +// A simple array with constructor. var myArray1 = new Array( "hello", "world" ); -// literal declaration, the preferred way +// Literal declaration, the preferred way. var myArray2 = [ "hello", "world" ]; ``` @@ -25,10 +25,10 @@ If the values are unknown, it is also possible to declare an empty Array, and ad var myArray = []; // adds "hello" on index 0 -myArray.push("hello"); +myArray.push( "hello" ); // adds "world" on index 1 -myArray.push("world"); +myArray.push( "world" ); // adds "!" on index 2 myArray[ 2 ] = "!"; @@ -76,7 +76,7 @@ You will need the `.length` property for looping through an array: var myArray = [ "hello", "world", "!" ]; for ( var i = 0; i < myArray.length; i = i + 1 ) { - console.log( myArray[i] ); + console.log( myArray[i] ); } ``` @@ -87,7 +87,7 @@ Except when using `for`/`in` loops: var myArray = [ "hello", "world", "!" ]; for ( var i in myArray ) { - console.log( myArray[ i ] ); + console.log( myArray[ i ] ); } ``` @@ -214,7 +214,7 @@ myArray.sort(); // 1, 3, 4, 6 ``` // sorting with comparing function function descending( a, b ) { - return b - a; + return b - a; } var myArray = [ 3, 4, 6, 1 ]; @@ -251,15 +251,15 @@ All of these are optional, but you will need at least the 'element' parameter in ``` // native forEach function printElement( elem ) { - console.log( elem ); + console.log( elem ); } function printElementAndIndex( elem, index ) { - console.log( "Index " + index + ": " + elem ); + console.log( "Index " + index + ": " + elem ); } function negateElement( elem, index, array ) { - array[ index ] = -elem; + array[ index ] = -elem; } myArray = [ 1, 2, 3, 4, 5 ]; diff --git a/page/javascript-101/closures.md b/page/javascript-101/closures.md index 1c929127..f1bfdd2a 100644 --- a/page/javascript-101/closures.md +++ b/page/javascript-101/closures.md @@ -13,16 +13,11 @@ As shown in the [Functions](/functions) section, functions have access to changi ``` // Each function executed within the loop will reference // the last value stored in i (5). -// this won't behave as we want it to - -// every 100 milliseconds, 5 will alert +// This won't behave as we want it to - every 100 milliseconds, 5 will alert for ( var i = 0; i < 5; i++ ) { - - setTimeout(function() { - - alert( i ); - - }, i * 100 ); - + setTimeout(function() { + alert( i ); + }, i * 100 ); } ``` @@ -32,46 +27,36 @@ Closures can be used to prevent this by creating a unique scope for each iterati // Using a closure to create a new private scope // fix: “close” the value of i inside createFunction, so it won't change var createFunction = function( i ) { - - return function() { - - alert( i ); - - }; - + return function() { + alert( i ); + }; }; for ( var i = 0; i < 5; i++ ) { - - setTimeout( createFunction( i ), i * 100 ); - + setTimeout( createFunction( i ), i * 100 ); } ``` Closures can also be used to resolve issues with the `this` keyword, which is unique to each scope: ``` -//Using a closure to access inner and outer object instances simultaneously +// Using a closure to access inner and outer object instances simultaneously. var outerObj = { - myName : "outer", - outerFunction : function() { - - // provide a reference to outerObj through innerFunction"s closure - var self = this; - - var innerObj = { - myName : "inner", - innerFunction : function() { - - console.log( self.myName, this.myName ); // "outer inner" - - } - }; - - innerObj.innerFunction(); - - console.log( this.myName ); // "outer" - } + myName: "outer", + outerFunction: function() { + // provide a reference to outerObj through innerFunction"s closure + var self = this; + var innerObj = { + myName: "inner", + innerFunction: function() { + console.log( self.myName, this.myName ); // "outer inner" + } + }; + + innerObj.innerFunction(); + + console.log( this.myName ); // "outer" + } }; outerObj.outerFunction(); @@ -88,54 +73,44 @@ As `bind` is a recent addition to ECMAScript 5, it may not be present in all bro // Shim from MDN if (!Function.prototype.bind) { - Function.prototype.bind = function( oThis ) { - - if (typeof this !== "function") { - - // closest thing possible to the ECMAScript 5 internal - // IsCallable function - throw new TypeError("Function.prototype.bind - what is trying to be bound is not callable"); - - } - - var fSlice = Array.prototype.slice, - aArgs = fSlice.call( arguments, 1 ), - fToBind = this, - fNOP = function() {}, - fBound = function() { + Function.prototype.bind = function( oThis ) { - return fToBind.apply( this instanceof fNOP - ? this - : oThis || window, - aArgs.concat( fSlice.call( arguments ) ) ); + if (typeof this !== "function") { + // closest thing possible to the ECMAScript 5 internal + // IsCallable function + throw new TypeError( "Function.prototype.bind - what is trying to be bound is not callable" ); + } - }; + var fSlice = Array.prototype.slice, + aArgs = fSlice.call( arguments, 1 ), + fToBind = this, + fNOP = function() {}, + fBound = function() { + return fToBind.apply( this instanceof fNOP + ? this + : oThis || window, + aArgs.concat( fSlice.call( arguments ) ) ); + }; - fNOP.prototype = this.prototype; - fBound.prototype = new fNOP(); + fNOP.prototype = this.prototype; - return fBound; - - }; + fBound.prototype = new fNOP(); + return fBound; + }; } ``` One of the simplest uses of `bind` is making a function that is called with a particular value for `this`, regardless of how it's called. A common mistake developers make is attempting to extract a method from an object, then later calling that method and expecting it to the use the origin object as its `this`. However, this can be solved by creating a bound function using the original object as demonstrated below: ``` -//let's manipulate "this" with a basic example +// Let's manipulate "this" with a basic example. var user = "johnsmith"; var module = { - - getUser: function() { - - return this.user; - - }, - - user: "janedoe" - + getUser: function() { + return this.user; + }, + user: "janedoe" }; // module.getUser() is called where "module" is "this" diff --git a/page/javascript-101/conditional-code.md b/page/javascript-101/conditional-code.md index 12bb7022..740ea65b 100644 --- a/page/javascript-101/conditional-code.md +++ b/page/javascript-101/conditional-code.md @@ -13,25 +13,25 @@ var foo = true; var bar = false; if ( bar ) { - // this code will never run - console.log("hello!"); + // this code will never run + console.log( "hello!" ); } if ( bar ) { - // this code won't run + // this code won't run } else { - if ( foo ) { + if ( foo ) { - // this code will run + // this code will run - } else { + } else { - // this code would run if foo and bar were both false + // this code would run if foo and bar were both false - } + } } ``` @@ -48,9 +48,9 @@ In order to use flow control successfully, it's important to understand which ki // Values that evaluate to true "0"; "any string"; -[]; // an empty array -{}; // an empty object -1; // any non-zero number +[]; // an empty array +{}; // an empty object +1; // any non-zero number ``` ``` @@ -58,8 +58,8 @@ In order to use flow control successfully, it's important to understand which ki ""; // an empty string NaN; // JavaScript's "not-a-number" variable null; -undefined; // be careful -- undefined can be redefined! -0; // the number zero +undefined; // be careful -- undefined can be redefined! +0; // the number zero ``` ## Conditional Variable Assignment with the Ternary Operator @@ -83,21 +83,16 @@ Rather than using a series of `if`/`else` blocks, sometimes it can be useful to // A switch statement switch ( foo ) { - case "bar": + case "bar": + alert( "the value was bar -- yay!" ); + break; - alert("the value was bar -- yay!"); + case "baz": + alert( "boo baz :(" ); + break; - break; - - case "baz": - - alert("boo baz :("); - - break; - - default: - - alert("everything else is just ok"); + default: + alert( "everything else is just ok" ); } ``` @@ -107,33 +102,27 @@ Switch statements have somewhat fallen out of favor in JavaScript, because often ``` var stuffToDo = { - "bar" : function() { - - alert("the value was bar -- yay!"); - - }, - - "baz" : function() { - - alert("boo baz :("); - - }, - - "default" : function() { + "bar": function() { + alert( "the value was bar -- yay!" ); + }, - alert("everything else is just ok"); + "baz": function() { + alert( "boo baz :(" ); + }, - } + "default": function() { + alert( "everything else is just ok" ); + } }; if ( stuffToDo[ foo ] ) { - stuffToDo[ foo ](); + stuffToDo[ foo ](); } else { - stuffToDo["default"](); + stuffToDo["default"](); } ``` diff --git a/page/javascript-101/functions.md b/page/javascript-101/functions.md index aec58bd0..23d46588 100644 --- a/page/javascript-101/functions.md +++ b/page/javascript-101/functions.md @@ -11,59 +11,51 @@ Functions contain blocks of code that need to be executed repeatedly. Functions Functions can be created in a variety of ways, two of which are shown below: ``` -// Function Declaration +// Function declaration. function foo() { - - /* do something */ - + /* do something */ } ``` ``` -// Named Function Expression +// Named function expression. var foo = function() { - - /* do something */ - + /* do something */ } ``` ## Using Functions ``` -// A simple function -var greet = function( person, greeting ) { - - var text = greeting + ", " + person; - - console.log( text ); +// A simple function. +var greet = function( person, greeting ) { + var text = greeting + ", " + person; + console.log( text ); }; greet( "Rebecca", "Hello" ); ``` ``` -// A function that returns a value -var greet = function( person, greeting ) { - - var text = greeting + ", " + person; - - return text; +// A function that returns a value. +var greet = function( person, greeting ) { + var text = greeting + ", " + person; + return text; }; console.log( greet( "Rebecca", "hello" ) ); // "hello, Rebecca" ``` ``` -// A function that returns another function -var greet = function( person, greeting ) { - var text = greeting + ", " + person; +// A function that returns another function. - return function() { - console.log( text ); - }; +var greet = function( person, greeting ) { + var text = greeting + ", " + person; + return function() { + console.log( text ); + }; }; var greeting = greet( "Rebecca", "Hello" ); @@ -76,11 +68,10 @@ greeting(); A common pattern in JavaScript is the immediately-invoked function expression. This pattern creates a function expression and then immediately executes the function. This pattern is extremely useful for cases where you want to avoid polluting the global namespace with code — no variables declared inside of the function are visible outside of it. ``` -// An immediately-invoked function expression -(function() { - - var foo = "Hello world"; +// An immediately-invoked function expression. +(function() { + var foo = "Hello world"; })(); console.log( foo ); // undefined! @@ -91,15 +82,16 @@ console.log( foo ); // undefined! In JavaScript, functions are "first-class citizens" — they can be assigned to variables or passed to other functions as arguments. Passing functions as arguments is an extremely common idiom in jQuery. ``` -// Passing an anonymous function as an argument +// Passing an anonymous function as an argument. + var myFn = function( fn ) { - var result = fn(); - console.log( result ); + var result = fn(); + console.log( result ); }; // logs "hello world" myFn( function() { - return "hello world"; + return "hello world"; }); ``` @@ -107,12 +99,12 @@ myFn( function() { // Passing a named function as an argument var myFn = function( fn ) { - var result = fn(); - console.log( result ); + var result = fn(); + console.log( result ); }; var myOtherFn = function() { - return "hello world"; + return "hello world"; }; myFn( myOtherFn ); // "hello world" diff --git a/page/javascript-101/getting-started.md b/page/javascript-101/getting-started.md index 217ae429..9b3d2d50 100644 --- a/page/javascript-101/getting-started.md +++ b/page/javascript-101/getting-started.md @@ -21,31 +21,29 @@ In the browser, JavaScript adds interactivity and behavior to HTML content. With Look at this simple HTML page that includes CSS and JavaScript to see how it all fits together: ``` - - + + - - Hello World - - + + Hello World + + -

Hello World

- - - - +

Hello World

+ + + ``` diff --git a/page/javascript-101/loops.md b/page/javascript-101/loops.md index a4e9d18d..d1e37a6b 100644 --- a/page/javascript-101/loops.md +++ b/page/javascript-101/loops.md @@ -12,7 +12,7 @@ Loops let a block of code run a certain number of times: // logs "try 0", "try 1", ..., "try 4" for ( var i = 0; i < 5; i++ ) { - console.log( "try " + i ); + console.log( "try " + i ); } ``` @@ -26,7 +26,7 @@ A `for` loop is made up of four statements and has the following structure: ``` for ( [initialisation]; [conditional]; [iteration] ) { - [ loopBody ] + [ loopBody ] } ``` @@ -44,13 +44,9 @@ Here's a typical `for` loop: ``` // A typical for loop for (var i = 0, limit = 100; i < limit; i++) { - - // This block will be executed 100 times - - console.log( 'Currently at ' + i ); - - // Note: the last log will be "Currently at 99" - + // This block will be executed 100 times + console.log( 'Currently at ' + i ); + // Note: the last log will be "Currently at 99" } ``` @@ -61,7 +57,7 @@ A while loop is similar to an `if` statement, except that its body will keep exe ``` while ( [conditional] ) { - [loopBody] + [loopBody] } ``` @@ -71,15 +67,12 @@ Here's a typical `while` loop: ``` // A typical while loop var i = 0; - while ( i < 100 ) { + // This block will be executed 100 times + console.log( "Currently at " + i ); - // This block will be executed 100 times - console.log( "Currently at " + i ); - - // increment i - i++; - + // increment i + i++; } ``` @@ -88,12 +81,9 @@ Notice that the counter is incrementing within the loop's body. It's possible to ``` // A while loop with a combined conditional and incrementer var i = -1; - while ( ++i < 100 ) { - - // This block will be executed 100 times - console.log( "Currently at " + i ); - + // This block will be executed 100 times + console.log( "Currently at " + i ); } ``` @@ -106,7 +96,7 @@ This is almost exactly the same as the `while` loop, except for the fact that th ``` do { - [ loopBody ] + [ loopBody ] } while ( [conditional] ) ``` @@ -115,10 +105,9 @@ Here's a `do-while` loop: ``` // A do-while loop do { - - // Even though the condition evaluates to false - // this loop's body will still execute once. - alert("Hi there!"); + // Even though the condition evaluates to false + // this loop's body will still execute once. + alert( "Hi there!" ); } while ( false ); ``` @@ -132,13 +121,9 @@ Usually, a loop's termination will result from the conditional statement not eva ``` // Stopping a loop for ( var i = 0; i < 10; i++ ) { - - if ( something ) { - - break; - - } - + if ( something ) { + break; + } } ``` @@ -147,16 +132,13 @@ You may also want to continue the loop without executing more of the loop's body ``` // Skipping to the next iteration of a loop for ( var i = 0; i < 10; i++ ) { + if ( something ) { + continue; + } - if ( something ) { - - continue; - - } - - // The following statement will only be executed - // if the conditional 'something' has not been met - console.log("I have been reached"); + // The following statement will only be executed + // if the conditional 'something' has not been met + console.log( "I have been reached" ); } ``` diff --git a/page/javascript-101/objects.md b/page/javascript-101/objects.md index f7d6f37f..bc3c1f01 100644 --- a/page/javascript-101/objects.md +++ b/page/javascript-101/objects.md @@ -10,12 +10,13 @@ Objects contain one or more key-value pairs. The key portion can be any string. As it turns out, nearly everything in JavaScript is an object — arrays, functions, numbers, even strings — and they all have properties and methods. ``` -// Creating an object literal +// Creating an object literal. + var myObject = { - sayHello : function() { - console.log("hello"); - }, - myName : "Rebecca" + sayHello: function() { + console.log( "hello" ); + }, + myName: "Rebecca" }; myObject.sayHello(); // "hello" @@ -26,10 +27,9 @@ console.log( myObject.myName ); // "Rebecca" When creating object literals, note that the key portion of each key-value pair can be written as any valid JavaScript identifier, a string (wrapped in quotes), or a number: ``` -// test var myObject = { - validIdentifier: 123, - "some string": 456, - 99999: 789 + validIdentifier: 123, + "some string": 456, + 99999: 789 }; ``` diff --git a/page/javascript-101/operators.md b/page/javascript-101/operators.md index 3fe5c474..cecb7fac 100644 --- a/page/javascript-101/operators.md +++ b/page/javascript-101/operators.md @@ -24,17 +24,13 @@ console.log( foo + " " + bar ); // "hello world" ``` // Incrementing and decrementing // The pre-increment operator increments the operand before any further processing. -// pre-increment: var i = 1; - -console.log( ++i ); // 2 +console.log( ++i ); // 2 - because i was incremented before evaluation console.log( i ); // 2 // The post-increment operator increments the operand after processing it. -// post-increment: var i = 1; - -console.log( i++ ); // 1 - because i was 1 +console.log( i++ ); // 1 - because i was evaluated to 1 and _then_ incremented console.log( i ); // 2 - incremented after using it ``` @@ -100,8 +96,7 @@ You'll sometimes see developers use these logical operators for flow control ins foo && doSomething( foo ); // set bar to baz if baz is truthy; -// otherwise, set it to the return -// value of createBar() +// otherwise, set it to the return value of createBar() var bar = baz || createBar(); ``` @@ -118,16 +113,16 @@ var bar = 0; var baz = "1"; var bim = 2; -foo == bar; // false -foo != bar; // true -foo == baz; // true; but note that the types are different +foo == bar; // false +foo != bar; // true +foo == baz; // true; but note that the types are different foo === baz; // false foo !== baz; // true foo === parseInt( baz ); // true -foo > bim; // false -bim > baz; // true -foo <= baz; // true +foo > bim; // false +bim > baz; // true +foo <= baz; // true ``` For more information about comparison operators, visit the [Mozilla Developer Network](https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Operators/Comparison_Operators "MDN - Comparison Operators"). diff --git a/page/javascript-101/running-code.md b/page/javascript-101/running-code.md index 1add6dcc..76f99392 100644 --- a/page/javascript-101/running-code.md +++ b/page/javascript-101/running-code.md @@ -11,7 +11,7 @@ attribution: The first and recommended option is to write code in an external file (with a ".js" extension), which can then be included on our web page using an HTML ` ``` ### Inline @@ -19,9 +19,9 @@ The first and recommended option is to write code in an external file (with a ". The second option is to inline the code directly on the web page. This is also achieved using HTML ` ``` @@ -30,7 +30,7 @@ The second option is to inline the code directly on the web page. This is also a The last option is to use the event handler attributes of HTML elements. This method is strongly discouraged: ``` - + Click Me!