added literals-and-constructors

chuanxshi · chuanxshi · commit f97ef7241723 · 2012-01-15T07:50:39.000+08:00
diff --git a/literals-and-constructors/array-literal.html b/literals-and-constructors/array-literal.html
@@ -0,0 +1,21 @@
+<!doctype html>
+<html lang="en">
+<head>
+<title>JavaScript Patterns</title>
+<meta charset="utf-8">
+</head>
+<body>
+<script>
+/* Title: Array literal
+ Description: use array literal notation to avoid potential errors when creating dynamic arrays at runtime
+*/
+
+// antipattern
+var a = new Array();
+
+// preferred
+var a = [];
+
+</script>
+</body>
+</html>
diff --git a/literals-and-constructors/enforcing-new.html b/literals-and-constructors/enforcing-new.html
@@ -0,0 +1,30 @@
+<!doctype html>
+<html lang="en">
+<head>
+<title>JavaScript Patterns</title>
+<meta charset="utf-8">
+</head>
+<body>
+<script>
+/* Title: Enforcing new
+ Description: when you forget `new`, `this` inside the constructor will point to the global object
+*/
+
+// constructor
+function Waffle(){
+ this.tastes = "yummy";
+}
+
+// antipattern
+// forgotten `new`
+var good_morning = Waffle();
+console.log(typeof good_morning); // "undefined"
+console.log(window.tastes); // "yummy"
+
+// preferred
+var good_morning = new Waffle();
+console.log(typeof good_morning); // "object"
+console.log(good_morning.tastes); // "yummy"
+</script>
+</body>
+</html>
diff --git a/literals-and-constructors/object-literal.html b/literals-and-constructors/object-literal.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<html lang="en">
+<head>
+<title>JavaScript Patterns</title>
+<meta charset="utf-8">
+</head>
+<body>
+<script>
+/* Title: Object literal
+ Description: use the simpler and reliable object literal instead of new Object();
+*/
+
+// antipattern
+var car = new Object();
+car.goes = "far";
+
+// preferred
+var car ={goes: "far"};
+
+</script>
+</body>
+</html>

-Original file line number
+Diff line change
@@ @@ -0,0 +1,30 @@ @@
 +<!doctype html>
 +<htmllang="en">
 +<head>
 +<title>JavaScript Patterns</title>
 +<metacharset="utf-8">
 +</head>
 +<body>
 +<script>
 +/* Title: Enforcing new
 + Description: when you forget `new`, `this` inside the constructor will point to the global object
 +*/
++
 +// constructor
 +functionWaffle(){
 +this.tastes="yummy";
 +}
++
 +// antipattern
 +// forgotten `new`
 +vargood_morning=Waffle();
 +console.log(typeofgood_morning);// "undefined"
 +console.log(window.tastes);// "yummy"
++
 +// preferred
 +vargood_morning=newWaffle();
 +console.log(typeofgood_morning);// "object"
 +console.log(good_morning.tastes);// "yummy"
 +</script>
 +</body>
 +</html>