Functional Programming in JavaScript Notes (Array map & filter)

Categories: JavaScript; Tagged with: ; @ November 20th, 2014 23:35

Array.Map:

Array.prototype.map = function(projectionFunction) {
     var results = [];
     this.forEach(function(itemInArray) {

        // ------------ INSERT CODE HERE! ----------------------------
         // Apply the projectionFunction to each item in the array and add
         // each result to the results array.
         // Note: you can add items to an array with the push() method.
         // ------------ INSERT CODE HERE! ----------------------------
     results.push(projectionFunction(itemInArray));

    });

    return results;
};

// JSON.stringify([1,2,3].map(function(x) { return x + 1; })) === '[2,3,4]'

Array.filter

Array.prototype.filter = function(predicateFunction) {
     var results = [];
     this.forEach(function(itemInArray) {
         // ------------ INSERT CODE HERE! ----------------------------
         // Apply the predicateFunction to each item in the array. If the
         // result is truthy, add each result to the results array.
         // Note: remember you can add items to the array using the array's
         // push() method.
         // ------------ INSERT CODE HERE! ----------------------------
     if(predicateFunction(itemInArray)) {
        results.push(itemInArray);
     }
     });

    return results;
};

// JSON.stringify([1,2,3].filter(function(x) { return x > 2})) === "[3]"

Chaining call

function() {
     var newReleases = [
             {
                 "id": 70111470,
                 "title": "Die Hard",
                 "boxart": "http://cdn-0.nflximg.com/images/2891/DieHard.jpg",
                 "uri": "http://api.netflix.com/catalog/titles/movies/70111470",
                 "rating": 4.0,
                 "bookmark": []
             },
             {
                 "id": 654356453,
                 "title": "Bad Boys",
                 "boxart": "http://cdn-0.nflximg.com/images/2891/BadBoys.jpg",
                 "uri": "http://api.netflix.com/catalog/titles/movies/70111470",
                 "rating": 5.0,
                 "bookmark": [{ id:432534, time:65876586 }]
             },
             {
                 "id": 65432445,
                 "title": "The Chamber",
                 "boxart": "http://cdn-0.nflximg.com/images/2891/TheChamber.jpg",
                 "uri": "http://api.netflix.com/catalog/titles/movies/70111470",
                 "rating": 4.0,
                 "bookmark": []
             },
             {
                 "id": 675465,
                 "title": "Fracture",
                 "boxart": "http://cdn-0.nflximg.com/images/2891/Fracture.jpg",
                 "uri": "http://api.netflix.com/catalog/titles/movies/70111470",
                 "rating": 5.0,
                 "bookmark": [{ id:432534, time:65876586 }]
             }
         ];

    // ------------   INSERT CODE HERE!  -----------------------------------
     // Chain the filter and map functions to select the id of all videos
     // with a rating of 5.0.

    return newReleases.
         filter(function(video) {
             return video.rating === 5.0;
         }).
         map(function(video) {
             return video.id;
         });
     // ------------   INSERT CODE HERE!  -----------------------------------
}

JavaScript Day1: Java Script Objects

Categories: JavaScript; Tagged with: ; @ November 13th, 2014 22:57
  // define a flight
        var flight = {
            airline: "KLM",
            number: 835,
            departure: {
                city: "SG",
                IATA: "SIN"
            },
            scheduleDays: [1, 2, 5]
        };

        console.log("Flight: ", flight);

        // add new attribute
        flight.code="KLM835";
        console.log("Added code: ", flight);

        // retrieve attribute
        console.log("Retrieve departure city:", flight.departure.city);

        // delete attribute
        console.log("Flight code: ", flight.code);
        delete flight.code;
        console.log("Deleted flight code: ", flight.code);

        // for...in
        for(day in flight.scheduleDays) {
            console.log("for...in: schedule day: ", day);
        }

        // for loop
        for(i = 0; i < flight.scheduleDays.length; i++ ) {
            console.log("Schedule day:", flight.scheduleDays[i], " @ index: " , i);
        }

        // define new function
        var printFlight = function(flight) {
         return "Flight print: " +  flight.airline + " - " + flight.number;
        };

        // initialize new flight via prototype;
        var flight2 = Object.create(flight);
        console.log("Flight2 created based on Flight: " +  printFlight(flight2));

        // add new attribute to the new flight
        flight2.code = "KML836";
        console.log("Flight2.code: ", flight2.code);
        console.log("Flight.code: ", flight.code);

        // update new flight
        flight2.airline = "SIA";
        console.log("Flight.airline: ", flight.airline);
        console.log("Flight2 airline", flight2.airline);

        // update the prototype;
        flight.airline = "BA";
        console.log("Flight.airline: ", flight.airline);
        console.log("Flight2 airline", flight2.airline);

        // type of
        console.log(typeof flight);
        console.log(typeof flight2);
        console.log(typeof flight.scheduleDays[0]);

output:

Flight: 
Object {airline: "KLM", number: 835, departure: Object, scheduleDays: Array[3]}
Added code: 
Object {airline: "KLM", number: 835, departure: Object, scheduleDays: Array[3], code: "KLM835"}
Retrieve departure city: SG
Flight code:  KLM835
Deleted flight code:  undefined for...in: schedule day:  0 for...in: schedule day:  1 for...in: schedule day:  2 Schedule day: 1  @ index:  0 Schedule day: 2  @ index:  1 Schedule day: 5  @ index:  2 Flight2 created based on Flight: Flight print: KLM - 835
Flight2.code:  KML836 Flight.code:  undefined
flight.airline:  KLM Flight2 airline SIA Flight.airline:  BA
Flight2 airline SIA object object number

Show/Hide Div using JavaScript

Categories: HTML&JS; Tagged with: ; @ August 7th, 2012 23:01

Show/Hide div by style.block using JavaScript.

the href button:

<a href="#" onclick="switchDiv()">SwitchDiv</a>

The js:

switchFlag = true;
function switchDiv() {
// alert("clicked");
switchFlag = !switchFlag;

var div1 = document.getElementById('div1');

var div2 = document.getElementById('div2');

if(switchFlag) {
div1.style.display="block";
div2.style.display="none";

}else {
div1.style.display="none";
div2.style.display="block";
}
}

ActionScript中呼叫JavaScript方法 – Call JavaScript Function In ActionScript

Categories: Flex; Tagged with: ; @ August 17th, 2010 17:12

需求: 在某些情况时, 如某Event响应后, 需要呼叫外部的JS代码以进行有关操作.
image

(more…)



// Proudly powered by Apache, PHP, MySQL, WordPress, Bootstrap, etc,.