Javascript入门学习

Javascript for beginners

1 print Hello world!

console.log("Hello world!");

2 comment your code

  • 2.1 in-line comment
console.log("Hello world!"); // in-line comment
  • 2.2 multi-line comment
/*

console.log("Hello\n");

console.log("world!\n");

*/

3 data types

  • undefined, null, boolean, string, symbol, number, and object
var a = 1;
console.log(a);

{
    var myName = 'Jim'; // used in the whole program
    console.log(myName);
}

{
    console.log(myName);
}

{
    let yourName = "Lily"; // used in the scope you declared
    console.log(yourName);
}

{
    // console.log(yourName); // yourName is not defined
}

{
    const pi = 3.14
    console.log(pi);
    // pi = 3.1415 // error of assignment of const variable
}

{
    // console.log(pi); // const used in the same scope and cannot be changed
}

4 declaration and assignment

var a;
var b = 2; // can change later
console.log(a);
console.log(b);
a = 1;
b = 3;
console.log(a);
console.log(b);
›undefined
›2
›1
›3

5 string plus and number plus

var a = 5;
var b = 15;
var c = "I am a ";
a = a + 1;
b = b + 1;
c = c + "string";
console.log(a);
console.log(b);
console.log(c);
›6
›16
›I am a string

6 case sensitive

var a = 5;
var B = 15;
console.log(a);
// console.log(b); // error b is not defined, variable use camel case

7 add 2 numbers

var sum = 10 + 10;
console.log(sum);

8 subtracting 2 numbers

var sub = 10 - 10;
console.log(sub);

9 multiplying 2 numbers

var multi = 10 * 10;
console.log(multi);

10 dividing 2 numbers

var div = 10 / 10;
console.log(div);

11 incrementing a number

var number = 10;
number = number + 1;
number += 1;
number++;
console.log(number);

12 decrementing numbers

var number = 10;
number = number - 1;
number -= 1;
number--;
console.log(number);

13 decimal numbers

var decimal = 10.999;
decimal--;
console.log(decimal);

14 multiply decimal numbers

var product = 2.0 * 0.0;
console.log(product);

15 divide decimal numbers

var quotient = 2.0 / 1.0;
console.log(quotient);

16 finding a remainder

var remainder;
remainder = 11 % 3;
console.log(remainder);

17 compound assignment with augmented addition

var a = 1;
var b = 1;
var c = 1;
 
a = a + 12;
b = b + 12;
c = c + 12;

a += 12;
b += 12;
c += 12;

console.log(a);
console.log(b);
console.log(c);

18 compound assignment with augmented subtraction

var a = 1;
var b = 1;
var c = 1;
 
a = a - 12;
b = b - 12;
c = c - 12;

a -= 12;
b -= 12;
c -= 12;

console.log(a);
console.log(b);
console.log(c);

19 compound assignment with augmented multiplication

var a = 1;
var b = 1;
var c = 1;
 
a = a * 12;
b = b * 12;
c = c * 12;

a *= 12;
b *= 12;
c *= 12;

console.log(a);
console.log(b);
console.log(c);

20 compound assignment with augmented division

var a = 8;
var b = 8;
var c = 8;
 
a = a / 2;
b = b / 2;
c = c / 2;

a /= 2;
b /= 2;
c /= 2;

console.log(a);
console.log(b);
console.log(c);

21 declaring string variables

var firstName = "Alan";
var lastName = "Turing";
console.log(firstName);
console.log(lastName);

22 escaping literal quotes in strings

var myStr = "I am a \"double quoted\" string inside \"double quotes\""; // backslash
console.log(myStr);
var httpStr = "<a hret=\"http://www.baidu.com\" target=\"_blank\">Link</a>" // backslash
console.log(httpStr);
var httpStr1 = '<a hret="http://www.baidu.com" target="_blank">Link</a>' // single quotes
console.log(httpStr1);
var httpStr2 = `'<a hret="http://www.baidu.com" target="_blank">Link</a>'` // backtsgs
console.log(httpStr2);

23 escaping sequences in string

/*
\'  single quote
\"  double quote
\\  backslash
\n  newline
\r  carriage return
\t  tab
\b  backspace
\f  form feed
*/
var my = "firstLine\n\t\\secondLine\nthirdLine";
console.log(my);

24 concatenating strings with plus assignment

var my = "firstLine ";
var your = "secondLine";
var his = my + your;
console.log(his);

25 concatenating strings with plus equal assignment

var my = "firstLine ";
my += "secondLine";
console.log(my);

26 concatenating strings with variables

var myName = "Jim";
var my = "My name is " + myName;
console.log(my);

27 appending variables to strings

var myName = "Jim";
var my = "My name is ";
my += myName;
console.log(my);

28 find length of a string

var firstName = "Ada";
var firstNameLength = 0;
firstNameLength = firstName.length;
console.log(firstNameLength);

var lastName = "Lovelace";
var lastNameLength = 0;
lastNameLength = lastName.length;
console.log(lastNameLength);

29 bracket notation to find first character in string

var firstName = "Ada";
var firstLetterOfName = "";
firstLetterOfName = firstName[0];
console.log(firstLetterOfName);

30 string immutability

var firstName = "Ada";
// firstName[0] = "a"; // cannot change
firstName = "ada"
console.log(firstName);

31 bracket notation to find nth(or last) character in string

var firstName = "Ada";
var lastLetterOfName = "";
lastLetterOfName = firstName[firstName.length - 1];
console.log(lastLetterOfName);

32 bracket notation to find nth to last character in string

var firstName = "Ada";
var nthLetterOfName = "";
nthLetterOfName = firstName[firstName.length - 2];
console.log(nthLetterOfName);

33 word blanks

function wordBlanks(Noun, Ajective, Verb, Adverb) {
    var result = "";
    result += "The " +Ajective + " " + Noun + " " + Verb + " " + Adverb;
    return result;
}

console.log(wordBlanks("dogs", "big", "ran", "quickly"))

34 store multiple values with arrays

var ourArray = ["John", 23];
var myArray = ["Jim", 22];
console.log(myArray);

35 nested array

var myArray = [["John", 23], ["Jim", 22]];
console.log(myArray);

36 accessing data and change data with indexes

var myArray = [["John", 23], ["Jim", 22]];
console.log(myArray[0][0]);
myArray[0][0] = "Ada";
console.log(myArray);

37 accessing multi-dimensional arrays

var myArray = [["John", 23], ["Jim", 22], [[5, 2], 1, 2, 3]];
console.log(myArray[2][0][0]);

38 manipulate arrays with push()

var myArray = [1, 2, 3];
myArray.push(4);
console.log(myArray);j

39 manipulate arrays with push()

var myArray = [1, 2, 3];
myArray.pop();
console.log(myArray);

40 manipulate arrays with shift()

var myArray = [1, 2, 3];
myArray.shift(); // pop left
console.log(myArray);

41 manipulate arrays with unshift()

var myArray = [1, 2, 3];
myArray.unshift(4); // append left
console.log(myArray);

42 shopping list

var myList = [["cereal", 3], ["milk", 2], ["bananas", 3], ["juice", 2], ["eggs"], 12];
console.log(myList);

43 write reusable functions

// no parameters
function ourFunction() {
    console.log("hello world!");
}
ourFunction();

// passing paarameters
function ourFunction(a, b) {
    console.log(a - b);
}
ourFunction(5, 4);

function ourFunction(a, b) {
    console.log(a + b);
}
ourFunction(5, 4);

44 global scope and functions

var myGlobal = 10;
var oopsGlobal = 5;

function func2() {
    var output = "";
    if (typeof myGlobal != "undefined") {
        output += "myGlobal: " + myGlobal;
    }
    if (typeof oopsGlobal != undefined) {
        output += " oopsGlobal: " + oopsGlobal;
    }
    console.log(output);
}
func2();

44 local scope and functions

function func2() {
    var output = 5;
    console.log(output);
}
func2();
// console.log(output); // not defined

45 global vs. local scope in functions

var output = 3; // global variable
function func() {
    var output = 5;
    return output;
}
console.log(func()); // result is 5
console.log(output); // still 3

46 return a value from a function

function func(num) {
    return num - 1;
}
console.log(func(2));

47 assignment with a returned value

var changed = 0;
function change(num) {
    return (num + 5) / 3;
}
changed = change(10);
console.log(changed);

var processed = 0;
function processFun(num) {
    return (num + 3) / 5;
}
processed = processFun(2);
console.log(processed);

48 stand in line: a queue

function nextInLine(arr, item) {
    arr.push(item);
    return arr.shift();
}

var testArr = [1, 2, 3, 4, 5];
console.log("Before: " + JSON.stringify(testArr)); // JSON.stringify(testArr): keep array
console.log(nextInLine(testArr, 6));
console.log("After: " + JSON.stringify(testArr));
›Before: [1,2,3,4,5]
›1
›After: [2,3,4,5,6]

49 boolean values

var isItTrue = true;
function boolean(isItTrue) {
    if (isItTrue) {
        return "yes";
    }
    return "No";
}

console.log(boolean(isItTrue));

50 comparison operator

function testEqual(val) {
    if (val == 12) {
        return "yes";
    }
    return "No";
}

console.log(testEqual(12)); // yes

function testEqual(val) {
    if (val == 12) {
        return "yes";
    }
    return "No";
}

console.log(testEqual("12")); // yes

51 strict equality

function testEqual(val) {
    if (val === 12) {
        return "yes";
    }
    return "No";
}

console.log(testEqual("12")); // No

52 strict inequality and inequality

function testEqual(val) {
    if (val != 12) {
        return "yes";
    }
    return "No";
}

console.log(testEqual("12")); // No

function testEqual(val) {
    if (val !== 12) {
        return "yes";
    }
    return "No";
}

console.log(testEqual("12")); // yes

53 if clause

function testValue(val) {
    if (val > 100) {
        return "over 100";
    }
    if (val > 10) {
        return "over 10";
    }
    return "10 or under";
}

console.log(testValue("12"));

function testValue(val) {
    if (val >= 100) {
        return "over 100 and 100";
    }
    if (val >= 10) {
        return "10 and over 10";
    }
    return "under";
}

console.log(testValue("12"));

function testValue(val) {
    if (val < 25) {
        return "under 25";
    }
    if (val < 55) {
        return "under 55";
    }
    return "55 and over";
}

console.log(testValue("12"));

function testValue(val) {
    if (val <= 25) {
        return "25 and under 25";
    }
    if (val <= 55) {
        return "55 andunder 55";
    }
    return "over 55";
}

console.log(testValue("12"));

54 logic and, or and not

function testValue(val) {
    if (val <= 55) {
        if (val >= 25) {
            return "25 to 55";
        }
    }
    return "other";
}

// this is better
console.log(testValue("30"));

function testValue(val) {
    if (val <= 55 && val >= 25) {
        return "25 to 55";
    }
    return "other";
}

console.log(testValue("30"));

function testValue(val) {
    if (val <= 10 || val >= 20) {
        return "outside"
    }
    return "inside";
}

console.log(testValue("15"));

function testValue(val) {
    if (!(val >= 10 && val <= 20)) {
        return "outside"
    }
    return "inside";
}

console.log(testValue("15"));

55 if else statement

function testValue(val) {
    if (val > 5) {
        return "outside"
    } else {
        return "inside";
    }
}

console.log(testValue("3"));

56 else if statement

function testValue(val) { 
    if (val < 5) {
        return "inside"
    } else if (val < 10) {
        return "midlle";
    } else {
        return "outside";
    }
}

console.log(testValue("11"));

// error
function testValue(val) { // order is important
    if (val < 10) {
        return "middle"
    } else if (val < 5) {
        return "inside";
    } else {
        return "outside";
    }
}

console.log(testValue("3")); // should be inside

57 chain if else

function testValue(val) {
    if (val < 5) {
        return "tiny"
    } else if (val < 10) {
        return "small";
    } else if (val < 15) {
        return "medium";
    } else if (val < 20) {
        return "large";
    } else {
        return "huge"
    }
}

console.log(testValue(11)); 

58 golf score

var names = ["hole-in-one", "eagle", "birdie", "par", "bogey", "double bogey", "go home"];
function golfScore(par, strokes) {
    if (strokes == 1) {
        return names[0]
    } else if (strokes <= par - 2) {
        return names[1];
    } else if (strokes <= par - 1) {
        return names[2];
    } else if (strokes <= par) {
        return names[3];
    } else if (strokes <= par + 1) {
        return names[4];
    } else if (strokes <= par + 2) {
        return names[5];
    } else if (strokes >= par + 2) {
        return names[6];
    }
}
console.log(golfScore(5, 8));

59 switch

function caseInSwitch(val) {
    var answer = "";
    switch(val) {
        case 1:
            answer = "alpha";
            break;
        case 2:
            answer = "beta";
            break;
        case 3:
            answer = "gamma";
            break;
        case 4:
            answer = "delta";
            break;     
    }
    return answer;
}

console.log(caseInSwitch(1));

// default
function caseInSwitch(val) {
    var answer = "";
    switch(val) {
        case 1:
            answer = "alpha";
            break;
        case 2:
            answer = "beta";
            break;
        case 3:
            answer = "gamma";
            break;
        case 4:
            answer = "delta";
            break;  
        default:
            answer = "nothing"
            break;   
    }
    return answer;
}

console.log(caseInSwitch(6));

// multiple input give same output
function caseInSwitch(val) {
    var answer = "";
    switch(val) {
        case 1:
        case 2:
        case 3:
            answer = "alpha";
            break;
        case 4:
        case 5:
            answer = "beta";
            break;
        case 6:
            answer = "gamma";
            break;
        case 7:
        case 8:
        case 9:
            answer = "delta";
            break;  
        default:
            answer = "nothing"
            break;   
    }
    return answer;
}

console.log(caseInSwitch(7));

60 change else if to switch

function changeToSwitch(val) {
    var answer = "";
    if (val === "bob") {
        answer = "B";
    } else if (val === 42) {
        answer = "42";
    } else if (val === 1) {
        answer = "1";
    } else if (val === 99) {
        answer = "99";
    } else if (val === 7) {
        answer = "7";
    }
    return answer;
}
console.log(changeToSwitch(7));

// switch is better, the code is more consize
function changeToSwitch(val) {
    var answer = "";
    switch (val) {
        case "bob": 
            answer = "B";
            break;
        case 42: 
            answer = "42";
            break;
        case 1: 
            answer = "1";
            break;
        case 99: 
            answer = "99";
            break;
        case 7: 
            answer = "7";
            break;
    }
    return answer;
}
console.log(changeToSwitch("bob"));

61 returning boolean values from functions

function isLess(a, b) {
    // fix this code
    if (a < b) {
        return true;
    } else {
        return false;
    }
}
console.log(isLess(10, 15));

// this code is better
function isLess(a, b) {
    return a < b;
}
console.log(isLess(10, 15));

63 undefined

function abTest(a, b) {
    if (a < 0 || b < 0) {
        return undefined;
    }
    return Math.round(Math.pow(Math.sqrt(a) + Math.sqrt(b), 2))
}
console.log(abTest(-2, 2));

64 counting cards

var count = 0;
function countingCards(card) {
    switch (card) {
        case 2:
        case 3:
        case 4:
        case 5:
        case 6:
            count++;
            break;
        case 10:
        case "J":
        case "Q":
        case "K":
        case "A":
            count--;
            break;
    }
    var holdbet = "hold";
    if (count > 0){
        holdbet = "bet";
    }
    return count + " " + holdbet;
}
console.log(countingCards(5));
console.log(countingCards(7));
console.log(countingCards("A"));

65 objects

var Dog = {
    "name": "Jim",
    "leg": 4,
    "tail": 1,
    "friends": ["everything!"]
};
console.log(Dog);

66 accessing object properties

var Dog = {
    "name": "Jim",
    "leg": 4,
    "tail": 1,
    "friends": ["everything!"],
    "the drinks": "water"
};
console.log(Dog.name);
console.log(Dog["the drinks"]); // if there is blank in key, use []

67 assign key to variable

var Dog = {
    12: "Jim",
    15: 4,
    16: 1,
    17: ["everything!"],
    18: "water"
};
var number = 18;
console.log(Dog[number]); // if there is blank in key, use []

68 updating objects

var Dog = {
    "name": "Jim"
};
Dog.name = "Lily";
console.log(Dog); 

69 adding and deleting properties from objects

var Dog = {
    "name": "Jim"
};
Dog.name = "Lily";
Dog.color = "black";
console.log(Dog); 
delete Dog.color;
console.log(Dog);

70 using objects for loops

// object is better than switch
function phoneticLookup(val) {
    var result = "";
    switch(val) {
        case "alpha":
            result = "Adams";
            break;
        case "bravo":
            result = "Boston";
            break;
        case "charlie":
            result = "Chicago";
            break;
        case "delta":
            result = "Denver";
            break;
        case "echo":
            result = "Easy";
            break;
        case "foxtrot":
            result = "Frank";
            break;
    }
    return result;
}

console.log(phoneticLookup("alpha"));

// object method
var result = "";
function phoneticLookup(val) {
    var lookup = {
    "alpha": "Adams",
    "bravo": "Boston",
    "charlie": "Chicago",
    "delta": "Denver",
    "echo": "Easy",
    "foxtrot": "Frank"
    };
    result = lookup[val];
    return result;
}

console.log(phoneticLookup("alpha"));

71 testing objects for properties

var myObj = {
"alpha": "Adams",
"bravo": "Boston",
"charlie": "Chicago",
"delta": "Denver",
"echo": "Easy",
"foxtrot": "Frank"
};

function checkObj(checkProp) {
    if (myObj.hasOwnProperty(checkProp)) {
        return myObj[checkProp];
    } else {
        return "Not found"
    }
}

console.log(checkObj("alpha"));

72 complex objects

var myMusic = [
    {
    "artist": "Adams",
    "title": "Boston",
    "released_year": 2005,
    "formats": [
        "CD",
        "8T",
        "LP"
    ],
    "gold": true
    },
    {
    "artist": "Adam",
    "title": "Bost",
    "released_year": 2003,
    "formats": [
        "C",
        "8",
        "L"
    ],
    "gold": true
    }
];

console.log(myMusic);

73 accessing property

var myMusic = { // use dot
    "artist": "Adams",
    "title": "Boston",
    "released_year": 2005,
    "formats": [
        "CD",
        "8T",
        "LP"
    ],
    "gold": true
    }

console.log(myMusic.formats[0]);

74 while loop

var myArray = [];

var i = 0;
while(i < 5) {
    myArray.push(i);
    i++;
}
console.log(myArray);
// ›[0, 1, 2, 3, 4]

75 for loop

var myArray = [];
for(var i = 0; i < 5; i++) {
    myArray.push(i);
}
console.log(myArray);
// ›[0, 1, 2, 3, 4]

var myArray = [];
for(var i = 0; i < 10; i += 2) {
    myArray.push(i);
}
console.log(myArray);

var myArray = [];
for(var i = 10; i > 0; i--) {
    myArray.push(i);
}
console.log(myArray);
// ›[10, 9, 8, 7, 6, 5, 4, 3, 2, 1]

76 iterate contents of an array

var myArray = [1, 2, 3, 4, 5];
for(var i = 0; i < 5; i++) {
    console.log(myArray[i]);
}

var myArray = [1, 2, 3, 4, 5];
for(var i = 0; i < myArray.length; i++) {
    console.log(myArray[i]);
}

77 nesting for loops

var myArray = [[1, 2], [3, 4], [5, 6, 7]];
for(var i = 0; i < myArray.length; i++) {
    for(var j = 0; j < myArray[i].length; j++)
    console.log(myArray[i][j]);
}

78 do while loop

var myArray = [];

var i = 0;
do {
    myArray.push(i);
    i++;
} while(i < 5); 
console.log(myArray);

79 look up contact file

var contacts = [ // can be many
    {
        "firstName": "A",
        "lastName": "B",
        "number": "0001",
        "likes": ["pizza", "coding"]
    }
]
function lookUpProfile(name, prop) {
    for(var i = 0; i < contacts.length; i++) {
        if(contacts[i].firstName === name) {
            return contacts[i][prop] || "No such property";
        }
    }
    return "No such contact";
}
var data = lookUpProfile("A", "likes");
console.log(data);

80 random fraction or numbers

function randomFraction() {
    return Math.random();
}
console.log(randomFraction());

var randomNumberBetween0and19 = Math.floor(Math.random() * 20);
function randomNumber() {
    return Math.floor(Math.random() * 10);
}
console.log(randomNumber());
console.log(randomNumberBetween0and19);

81 random number with range

function ourRandomRange(Min, Max) {
    return Math.floor(Math.random() * (Max - Min + 1)) + Min;
}
console.log(ourRandomRange(1, 3));

82 parseInt function

function convertToInt(str) {
    return parseInt(str);
}
console.log(convertToInt("56"));

83 parseInt function with a radix

function convertToInt(str) {
    return parseInt(str, 2);
}
console.log(convertToInt("101"));

84 ternary operator

function checkEqual(a, b) {
    return a === b ? true : false;
    // return a === b;
}
console.log(checkEqual(1, 2));

85 multiple ternary operator

function checkSign(num) {
    return num > 0 ? "positive" : num < 0 ? "negative" : "zero";
}
console.log(checkSign(0));

86 difference between var and let

// let is used in the scope of functon, var is used as global variable
let catName = "Jim";
let quote;
// let catName = "Lily"; let cannot define same name twice
catName = "Lily"; // ok

function catTalk() {
    "use strict";
    catName = "Oliver";
    quote = catName + " says Meow!";
    return quote;
}
console.log(catTalk());

87 const cannot change

const catName = "Jim"; // error
let quote;
// let catName = "Lily"; let cannot define same name twice
catName = "Lily"; // ok

function catTalk() {
    "use strict";
    catName = "Oliver";
    quote = catName + " says Meow!";
    return quote;
}
console.log(catTalk());

88 const array

const array = [1, 2, 3];
function check(){
    "use strict";
    // array = [1, 2, 2]; // not ok
    array[1] = 3; // ok
}
check();
console.log(array);

89 prevent object mutation

function freezeObj() {
    "use strict";
    const MATH_CONSTANTS = {
        PI: 3.14
    };
    Object.freeze(MATH_CONSTANTS);
    try {
        MATH_CONSTANTS.PI = 99;
    } catch( ex ) {
        console.log(ex);
    }
    return MATH_CONSTANTS.PI;
}

const P = freezeObj();

console.log(P);

90 arrow function

// step 1
var magic = function() {
    return new Date();
}
console.log(magic());
// step 2
var magic = () => {
    return new Date();
}
console.log(magic());
// step 3
const magic = () => new Date();
console.log(magic());

91 arrow function with parameters

// var myConcat = function(arr1, arr2) {
//     return arr1.concat(arr2);
// };
// console.log(myConcat([1, 2], [3, 4, 5]));

var myConcat = (arr1, arr2) => arr1.concat(arr2);
console.log(myConcat([1, 2], [3, 4, 5]));

92 filter and map function

const realNumberArray = [4, 5.6, -9.8, 4, 5, 6, 7];

const squareList = (arr) => {
    // filter: keep in the list  of filter condition, map : key in python
    const squareIntegers = arr.filter(num => Number.isInteger(num) && num > 0).map(x => x * x); 
    return squareIntegers;
};

const squareIntegers = squareList(realNumberArray);
console.log(squareIntegers);

93 write higher order arrow function

const increment = (function() {
    return function increment(number, value = 1) {
        return number + value;
    }
})();
console.log(increment(5, 2));
console.log(increment(5));

94 use the rest operator with function parameters

const sum = (function() {
    return function sum(x, y, z) {
        const args = [x, y, z];
        return args.reduce((a, b) => a + b, 0);
    };
})();
console.log(sum(1, 2, 3)); // before only 3 parameters

const sum = (function() {
    return function sum(...args) {
        return args.reduce((a, b) => a + b, 0);
    };
})();
console.log(sum(1, 2, 3, 4)); // now many parameters

95 use the spread operator to evaluate array in -place

const arr1 = ["a", "b", "c", "d", "e"];
let arr2;
(function() {
    arr2 = arr1;
    arr1[0] = "potato";
})();
console.log(arr2); // the result will be ["potato", "b", "c", "d", "e"]

const arr1 = ["a", "b", "c", "d", "e"];
let arr2;
(function() {
    arr2 = [...arr1]; // spread
    arr1[0] = "potato";
})();
console.log(arr2); // the result will be ["a", "b", "c", "d", "e"]

96 use destructuring assignments to assign var from objects

var voxel = {x: 3, y: 4, z: 5};

// var x = voxel.x;
// var y = voxel.y;
// var z = voxel.z;

const {x: a, y: b, z: c} = voxel;
console.log(a);

97 destructuring assignments with nested objects

const LOCAL_FORCAST = {
    today: {min: 72, max: 83},
    tomorrow: { min:73.3, max: 84.6 }
};

function getMaxOfTomorrow(forecast) {
    "use strict";
    
    const { tomorrow : { max : maxOfTomorrow }} = forecast;
    return maxOfTomorrow;
}

console.log(getMaxOfTomorrow(LOCAL_FORCAST));

98 destructuring assignment to arrays

const [z, x, , y] = [1, 2, 3, 4, 5, 6];
console.log(z, x, y);

let a = 8, b = 6;
(() => {
    "use strict";
    [a, b] = [b, a];
})();
console.log(a);
console.log(b);1,2,468

99 destructuring assignment with the rest operator

const source = [1, 2, 3, 4, 5, 6, 7, 8, 9 , 10];
function removeFirstTwo(list) {
    
    const [ , , ...arr] = list;
    
    return arr;
}
const arr = removeFirstTwo(source);
console.log(arr);
console.log(source);

100 use destructuring assignment to pass an object as a function’s parameters

const stats = {
    max: 5,
    standard_deviation: 1,
    median: 3,
    mode: 2,
    min: 0,
    average: 4
};
const half = (function() {
    return function half(stats) {
        return (stats.max + stats.min) / 2.0;
    };
})();
console.log(stats);
console.log(half(stats));

// only pass what we need
const stats = {
    max: 5,
    standard_deviation: 1,
    median: 3,
    mode: 2,
    min: 0,
    average: 4
};
const half = (function() {
    return function half({ max, min}) {
        return (max + min) / 2.0;
    };
})();
console.log(stats);
console.log(half(stats));

101 creating strings using template literals

const person = {
    name: "Jim",
    age: 20
};

const greeting = `Hello, my name is ${person.name}!
I am ${person.age} years old.`;

console.log(greeting);

102 write concise object literal declarations using simple fields

const person = (name, age, gender) => {
    
    return {
    name: gender,
    age: age,
    gender: gender
    };
};

console.log(person("Jim", 20, "male"));

// same
const person = (name, age, gender) => ({ name, age, gender });
console.log(person("Jim", 20, "male"));

103 concise declaration functions

const bicycle = {
  gear: 2,
  setGear: function(newGear) {
      "use strict";
      this.gear = newGear;
  }  
};
bicycle.setGear(3);
console.log(bicycle.gear);

// same
const bicycle = {
  gear: 2,
  setGear(newGear) {
      "use strict";
      this.gear = newGear;
  }  
};
bicycle.setGear(3);
console.log(bicycle.gear);

104 use class syntax to define a constructor function

var spaceShuttle = function(targetPlanet) {
    this.targetPlanet = targetPlanet;
}
var zeus = new spaceShuttle("Jupiter");

console.log(zeus.targetPlanet);

// class
class spaceShuttle {
    constructor(targetPlanet) {
        this.targetPlanet = targetPlanet;
    }
}
var zeus = new spaceShuttle("Jupiter");
console.log(zeus.targetPlanet);


//class
function makeClass() {
    class Vegetable {
        constructor(name) {
            this.name = name;
        }
    }
    return Vegetable;
}
const Vege = makeClass();
const carrot = new Vege("carrot");
console.log(carrot.name);

105 use getters and setters to control access to an object

class Book {
    constructor(author) {
        this._author = author;
    }
    // getter
    get writer() {
        return this._author;
    }
    // setter
    set writer(updatedAuthor) {
        this._author = updatedAuthor;
    }
}

function makeClass() {
    class Thermostat {
        constructor(temp) {
            this._temp = 5 / 9 * (temp - 32);
        }
        get temperature() {
            return this._temp;
        }
        set temperature(updatedTemp) {
            this._temp = updatedTemp;
        }
    }
    return Thermostat;
}

const Thermostat = makeClass();
const thermos = new Thermostat(76);
let temp = thermos.temperature;
thermos.temperature = 26;
temp = thermos.temperature;
console.log(temp);

106 import and require

// file: string_function.js
export const capitalizeString = str => str.toUpperCase()

// main file
import { capitalizeString } from "./string_function"
const cap = capitalizeString("Hello");

console.log(cap);

107 use export to reuse a function block

const capitalizeString = (string) => {
    return string.charAt(0).toUpperCase() + string.slice(1);
}

export { capitalizeString };
export const foo = "bar";
export const bar = "foo";

108 use * to import everything

import * as capitalizeStrings from "index_fileName";

109 create an export fallback with export default

export default function subtract(x, y) {return x - y;}

110 create an export fallback with export default

import subtract from "math_functions";
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值