summaryrefslogtreecommitdiffhomepage
path: root/javascript.html.markdown
diff options
context:
space:
mode:
authorAdam Brenecki <adam@brenecki.id.au>2013-06-29 21:09:19 +0930
committerAdam Brenecki <adam@brenecki.id.au>2013-06-29 21:09:19 +0930
commit9c81beb8114d246cd0de5e83340363cdebc87155 (patch)
treea205fffc99ff0358e791f88fd60eb6cad740c741 /javascript.html.markdown
parenta8672f19bfe97c0f9157d7ff1050913df75c976e (diff)
Begin writing about JavaScript arrays and dictionaries
Diffstat (limited to 'javascript.html.markdown')
-rw-r--r--javascript.html.markdown121
1 files changed, 113 insertions, 8 deletions
diff --git a/javascript.html.markdown b/javascript.html.markdown
index 826fe7cd..1565f541 100644
--- a/javascript.html.markdown
+++ b/javascript.html.markdown
@@ -92,24 +92,41 @@ false
null // = null
/***********
- * 2. Variables and Lists
+ * 2. Variables, Arrays and Objects
***********/
-// variables are declared with the var keyword
+// Variables are declared with the var keyword. Javascript is dynamically typed,
+// so you don't need to specify type. Assignment uses a single = character.
var some_var = 5
-// if you leave them off, you won't get an error...
+// if you leave the var keyword off, you won't get an error...
some_other_var = 10
// but your variable will always end up with the global scope, even if it wasn't
// defined there, so don't do it.
-/***********
- * 3. Control Structures
- ***********/
+// Arrays are ordered lists of values, of any type.
+["Hello", 45, true]
+
+// JavaScript's objects are equivalent to 'dictionaries' or 'maps' in other
+// languages: an unordered collection of key-value pairs.
+{key1: "Hello", key2: "World"}
+
+// Keys are strings, but quotes aren't required if they're a valid
+// JavaScript identifier. Values can be any type.
+var myObj = {myKey: "myValue", "my other key": 4}
+
+// Object attributes can be accessed using the 'subscript' syntax,
+myObj["my other key"] // = 4
+
+// ... or using the dot syntax, provided the key is a valid identifier.
+myObj.myKey // = "myValue"
+
+// Objects are mutable, values can be changed and new keys added.
+myObj.myThirdKey = true
/***********
- * 4. Objects
+ * 3. Control Structures
***********/
/***********
@@ -117,6 +134,94 @@ some_other_var = 10
***********/
/***********
- * 6. Constructors and Prototypes
+ * 6. More about Objects; Constructors and Prototypes
***********/
+
+// Objects can contain functions, which can be called using the dot syntax.
+myObj = {
+ myFunc: function(){
+ return "Hello world!"
+ }
+}
+myObj.myFunc() // = "Hello world!"
+
+// When functions are called like this, they can access the object they're
+// attached to using the this keyword.
+myObj = {
+ myString: "Hello world!",
+ myFunc: function(){
+ return this.myString
+ }
+}
+myObj.myFunc() // = "Hello world!"
+
+// The value of this has to do with how the function is called, not where it's
+// defined. So, that doesn't work if the function isn't called in the context of
+// the object.
+var myFunc = myObj.myFunc
+myFunc() // = undefined
+
+// Inversely, a function can be assigned to the object and gain access to it
+// through this, even if it wasn't defined as such.
+var myOtherFunc = function(){
+ return this.myString.toUpperCase()
+}
+myObj.myOtherFunc = myOtherFunc
+myObj.myOtherFunc() // = "HELLO WORLD!"
+
+// When you call a function with the new keyword, a new object is created, and
+// made available to the function via this. Functions designed to be called
+// like this are called constructors.
+
+var MyConstructor = function(){
+ this.myNumber = 5
+}
+myNewObj = new MyConstructor() // = {myNumber: 5}
+myNewObj.myNumber // = 5
+
+// JavaScript objects aren't defined in terms of classes like other languages,
+// but you can use prototypes to do many of the same things. When you try to
+// access a property of an object that isn't present, its prototype is searched.
+var myObj = {}
+var myPrototype = {
+ meaningOfLife: 42,
+ myThirdFunc: function(){
+ return this.myString.toLowerCase()
+ }
+}
+myObj.__proto__ = myPrototype
+myObj.myThirdFunc() // = "hello world!"
+
+// Of course, if your property isn't on your prototype, the prototype's
+// prototype is searched, and so on.
+myPrototype.__proto__ = {
+ myBoolean: true
+}
+myObj.myBoolean // = true
+
+// There's no copying involved here; each object stores a reference to its
+// prototype. This means we can alter the prototype and our changes will be
+// reflected everywhere.
+myObj.
+
+// The __proto__ magic property we've used to access prototypes isn't standard,
+// and shouldn't be used in real-world code. There is a way to create a new
+// object with another given object as its prototype, though:
+var myObj = Object.create(myPrototype)
+myObj.meaningOfLife // = 42
+
+// Unfortunately, Object.create is quite recent and isn't available in many
+// browsers, so you often can't use that, either. The most reliable way to set
+// prototypes involves constructors.
+
+// TODO: write about the .prototype property on constructors
+
+// Built-in types' prototypes work like this too, so you can actually change
+// the prototype of a string, for instance (although whether you should is
+// another matter).
+String.prototype.firstCharacter = function(){
+ return this.charAt(0)
+}
+"abc".firstCharacter() // = "a"
+
```