Javascript Notes

Get started with Programming

Javascript中的保留字，但是大部分却没在这个语言中使用。undefined，NaN，Infinity也应该算保留字。

abstract 
boolean break byte 
case catch char class const continue 
debugger default delete do double
else enum export extends 
false final finally float for function 
goto 
if implements import in instanceof int interface 
long 
native new null 
package private protected public 
return 
short static super switch synchronized 
this throw throws transient true try typeof 
var volatile void 
while with

confirm("I am ok");
prompt("Are you ok?");

"text".length
console.log();

> Greater than
< Less than
<= Less than or equal to
>= Greater than or equal to
=== Equal to
!== Not equal to

"text".substring(0, 2);

confirm("I am ready to play!");
var age = prompt("What's your age");
if (age < 13) {
    console.log("You're allowed to play but you take no responsibility.");
} else {
    console.log("Play on!");    
}

console.log("You are at a Justin Bieber concert, and you hear this lyric 'Lace my shoes off, start racing.'");

console.log("Suddenly, Bieber stops and says, 'Who wants to race me?'");

var userAnswer = prompt("Do you want to race Bieber on stage?");

if (userAnswer === "yes") {
    console.log("You and Bieber start racing. It's neck and neck! You win by a shoelace!");    
} else {
    console.log("Oh no! Bieber shakes his head and sings 'I set a pace, so I can race without pacing.'");    
}

var feedback = prompt("Could you give a rate?");
if (feedback > 8) {
    console.log("Thank you! We should race at the next concert!");    
} else {
    console.log("I'll keep practicing coding and racing.");    
}

var userChoice = prompt("Do you choose rock, paper or scissors?");
var computerChoice = Math.random();
if (computerChoice < 0.34) {
    computerChoice = "rock";
} else if(computerChoice <= 0.67) {
    computerChoice = "paper";
} else {
    computerChoice = "scissors";
} console.log("Computer: " + computerChoice);

var compare = function(choice1, choice2) {
    if (choice1 === choice2) {
        return "The result is a tie!";
    } else if (choice1 === "rock") {
        if (choice2 === "scissors") {
            return "rock wins";    
        } else {
            return "paper wins";    
        }
    } else if (choice1 === "paper") {
        if (choice2 === "scissors") {
            return "scissors wins";    
        } else {
            return "paper wins";    
        }
    } else {
        if (choice2 === "paper") {
            return "scissors wins";    
        } else {
            return "rock wins";    
        }
    }
}

compare(userChoice, computerChoice);

var slaying =  true;
var youHit =  Math.floor(Math.random() * 2);
var damageThisRound = Math.floor(Math.random() * 5 + 1);
var totalDamage = 0;

while (slaying) {
  if (youHit) {
    console.log("You hit the dragon and did " + damageThisRound + " damage!");
    totalDamage += damageThisRound;
    
    if (totalDamage >= 4) {
      console.log("You did it! You slew the dragon!");
      slaying = false;
    } else {
      youHit = Math.floor(Math.random() * 2);
    }
  } else {
    console.log("The dragon burninates you! You're toast.");
    slaying = false;
  }
}

Objects in JS

var phonebookEntry = {};

phonebookEntry.name = 'Oxnard Montalvo';
phonebookEntry.number = '(555) 555-5555';
phonebookEntry.phone = function() {
  console.log('Calling ' + this.name + ' at ' + this.number + '...');
};

phonebookEntry.phone();

var me = {name: "Dave Obama", age: 55};

var me = new Object();
me.name = "Dave Obama";
me["gender"] = "male";
me.age = 55;

var friends = {};
friends.bill = {
  firstName: "Bill",
  lastName: "Gates",
  number: "(206) 555-5555",
  address: ['One Microsoft Way','Redmond','WA','98052']
};
friends.steve = {
  firstName: "Steve",
  lastName: "Jobs",
  number: "(408) 555-5555",
  address: ['1 Infinite Loop','Cupertino','CA','95014']
};

var list = function(obj) {
  for(var prop in obj) {
    console.log(prop);
  }
};

var search = function(name) {
  for(var prop in friends) {
    if(friends[prop].firstName === name) {
      console.log(friends[prop]);
      return friends[prop];
    }
  }
};

list(friends);
search("Steve");

Introduction to Objects

dot notation => new Object()

bracket notation => { }

// here we define our method using "this", before we even introduce bob
var setAge = function (newAge) {
  this.age = newAge;
};
// now we make bob
var bob = new Object();
bob.age = 30;
// and down here we just use the method we already made
bob.setAge = setAge;
  
// change bob's age to 50 here
bob.setAge(50);

var square = new Object();
square.sideLength = 6;
square.calcPerimeter = function() {
  return this.sideLength * 4;
};
// help us define an area method here

square.calcArea = function() {
    return this.sideLength * this.sideLength;    
};

var p = square.calcPerimeter();
var a = square.calcArea();

function Rabbit(adjective) {
    this.adjective = adjective;
    this.describeMyself = function() {
        console.log("I am a " + this.adjective + " rabbit");
    };
}

// now we can easily make all of our rabbits

var rabbit1 = new Rabbit("fluffy");
var rabbit2 = new Rabbit("happy");
var rabbit3 = new Rabbit("sleepy");

rabbit1.describeMyself();
rabbit2.describeMyself();
rabbit3.describeMyself();

Why is using “for…in” with array iteration such a bad idea?

function Circle (radius) {
    this.radius = radius;
    this.area = function () {
        return Math.PI * this.radius * this.radius;
        
    };
    // define a perimeter method here
    this.perimeter = function () {
        return Math.PI * this.radius * 2;    
    }
};

// complete these definitions so that they will have
// the appropriate types
var anObj = { job: "I'm an object!" };
var aNumber = 42;
var aString = "I'm a string!";

console.log( typeof anObj ); // should print "object"
console.log( typeof aNumber ); // should print "number"
console.log( typeof aString ); // should print "string"


var myObj = {
    // finish myObj
    name: "Obama"
};

console.log( myObj.hasOwnProperty('name') ); // should print true
console.log( myObj.hasOwnProperty('nickname') ); // should print false


var suitcase = {
    shirt: "Hawaiian"
};

if (suitcase.hasOwnProperty("shorts")) {
    console.log(suitcase.shorts);
} else {
    suitcase.shorts = "Hello";
    console.log(suitcase.shorts);
}


var nyc = {
    fullName: "New York City",
    mayor: "Bill de Blasio",
    population: 8000000,
    boroughs: 5
};

for (var prop in nyc) {
    console.log(prop);    
    console.log(nyc[prop]); 
}

function Dog (breed) {
  this.breed = breed;
}

// here we make buddy and teach him how to bark
var buddy = new Dog("Golden Retriever");
buddy.bark = function() {
  console.log("Woof");
};
buddy.bark();

// here we make snoopy
var snoopy = new Dog("Beagle");
// we need you to teach snoopy how to bark here
snoopy.bark = function() {
    console.log("abc");    
}
// this causes an error, because snoopy doesn't know how to bark!
snoopy.bark();

function Dog (breed) {
  this.breed = breed;
};

// here we make buddy and teach him how to bark
var buddy = new Dog("golden Retriever");
Dog.prototype.bark = function() {
  console.log("Woof");
};
buddy.bark();

// here we make snoopy
var snoopy = new Dog("Beagle");
/// this time it works!
snoopy.bark();

//Example of inheriting methods
// the original Animal class and sayName method
function Animal(name, numLegs) {
    this.name = name;
    this.numLegs = numLegs;
}
Animal.prototype.sayName = function() {
    console.log("Hi my name is " + this.name);
};

// define a Penguin class
function Penguin(name) {
    this.name = name;
    this.numLegs = 2;
}

// set its prototype to be a new instance of Animal
Penguin.prototype = new Animal();



//Example of inheriting properties
function Penguin(name) {
    this.name = name;
    this.numLegs = 2;
}

// create your Emperor class here and make it inherit from Penguin
function Emperor(name) {
    this.name = name;    
}

Emperor.prototype = new Penguin();
// create an "emperor" object and print the number of legs it has
var emperor = new Emperor("Dave");
console.log(emperor.numLegs);

var languages = {
    english: "Hello!",
    french: "Bonjour!",
    notALanguage: 4,
    spanish: "Hola!"
};

// print hello in the 3 different languages
for (var prop in languages) {
    if (typeof languages[prop] === "string")
        console.log(languages[prop]);
}

// what is this "Object.prototype" anyway...?
var prototypeType = typeof Object.prototype;
console.log(prototypeType);

// now let's examine it!
var hasOwn = Object.prototype.hasOwnProperty("hasOwnProperty");
console.log(hasOwn);

function StaffMember(name,discountPercent){
    this.name = name;
    this.discountPercent = discountPercent;
}

var sally = new StaffMember("Sally",5);
var bob = new StaffMember("Bob",10);

// Create yourself again as 'me' with a staff discount of 20%
var me = new StaffMember("Dave", 20);


var cashRegister = {
    total:0,
    lastTransactionAmount: 0,
    add: function(itemCost){
        this.total += (itemCost || 0);
        this.lastTransactionAmount = itemCost;
    },
    scan: function(item,quantity){
        switch (item){
        case "eggs": this.add(0.98 * quantity); break;
        case "milk": this.add(1.23 * quantity); break;
        case "magazine": this.add(4.99 * quantity); break;
        case "chocolate": this.add(0.45 * quantity); break;
        }
        return true;
    },
    voidLastTransaction : function(){
        this.total -= this.lastTransactionAmount;
        this.lastTransactionAmount = 0;
    },
    // Create a new method applyStaffDiscount here
    applyStaffDiscount: function(employee) {
        this.total *= (100 - employee.discountPercent)/100;    
    }
    
};

cashRegister.scan('eggs',1);
cashRegister.scan('milk',1);
cashRegister.scan('magazine',3);
// Apply your staff discount by passing the 'me' object 
// to applyStaffDiscount
cashRegister.applyStaffDiscount(me);

// Show the total bill
console.log('Your bill is '+cashRegister.total.toFixed(2));

var myObject = {value: 10};
var add =function (a, b) {return a + b;}; // “this” is not whomever calls the object.

myObject.double = function () {     
    var that = this;    // Workaround.
    var helper = function () {         
        that.value = add(that.value, that.value);     
    };     
    helper();
    // Invoke helper as a function.
};
// Invoke double as a method.
myObject.double();
console.log(myObject.value);

var add = function (a, b) {     
    if (typeof a !== 'number' || typeof b !== 'number') {         
        throw {             
            name: 'TypeError',             
            message: 'add needs numbers'         
        };     
    }     
    return a + b;
}

var try_it = function () {
    try {         
        add("seven");     
    } catch (e) {         
        console.log(e.name + ': ' + e.message);
    }
}

try_it();

var myObject = (function () {     
    var value = 0;     
    return {         
        increment: function (inc) {             
            value += typeof inc === 'number' ? inc : 1;         
        },         
        getValue: function () {             
            return value;         
        }     
    };
}());

myObject.increment(45);
myObject.increment(25);
console.log(myObject.getValue());

var fade = function (node) {
    var level = 1;
    var step = function () {
        var hex = level.toString(16);
        node.style.backgroundColor = '#FFFF' + hex + hex;
        if (level < 15) {
            level += 1;
            setTimeout(step, 100);
        }
    };     
    setTimeout(step, 100);
};

fade(document.body);



<html>
    <body>
        <pre>
            <script src="program.js"></script>
        </pre>
    </body>
</html>

var i, word, 
text = "This oracle of comfort has so pleased me, " + 
"That when I am in heaven I shall desire " + 
"To see what this child does, " + 
"and praise my Constructor.";

var words = text.toLowerCase().split(/[s,.]+/);
var count = {};
for (i = 0; i < words.length; i += 1) {
    word = words[i];
    if (typeof count[word] === 'number') { // Do not use if (count[word])  here, because count inherited “constructor” from Object. += does concatenation when its operators are not numbers.
        count[word] += 1;
    } else {
            count[word] = 1;    
    }     
}

for (var prop in count) {
    console.log(prop + ": " + count[prop]);
}