|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 |
// crreate a whole random number between [0,20) function wholeRandomNumber(){ return Math.floor(Math.random() * 20) } console.log(wholeRandomNumber()) // random numbers within a range [min, max] function randomRange(min, max){ return Math.floor(Math.random()*(max-min + 1)) + min } console.log(randomRange(1,2)) // parseInt // return integer from a string. It will returrn NaN if string cannot be converted to a number function convertToIntegerr(str){ return parseInt(str) } console.log("parseInt: "+ convertToIntegerr("55")) console.log("parseInt: "+ convertToIntegerr("ABC")) // parseInt also takes in a radix. So it can convert a binary/octal string to base 10 integer. // Radix is the base, like 2 for binary. Default is base 10 function convertToIntegerradix(str, base){ return parseInt(str, base) } console.log("parseInt: "+ convertToIntegerradix("10001", 2)) console.log("parseInt: "+ convertToIntegerradix("a0", 16)) // Object.freeze // use this to make objects read-only // note that using const makes simple variables (that contain datatypes other than object, array, dict) read-only // objects, arrays can be mutated even after being declared const. To make these read-only, use Object.freeze 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 } console.log("freeze object: " + freezeObj()) // anonymous function // below are all equivalent functions const todaysDate = function(){ return new Date() } const todaysDateArrow = () => { return new Date() } // if the function has just one line, do this const todaysDateArrowOneLiner = () => new Date() // Arrow funtions work very well with Higher Order Functions like map, filter and reduce // i.e. whenever one function takes another function as an arguement, // its a good candidate for arrow function // example: iterate over an array and filter all positive integers and square them and return their sum myArr = [1,-2, 1.5, 3.4, 5] const sum = arr => arr.filter(num=> Number.isInteger(num) && num > 0) .map(x => x**2) .reduce((acc, currVal)=>acc+currVal, 0) console.log("arrow higher order sum: " + sum(myArr)) // rest operator allows you to create a function with variable number of aguments // rest opeartor is ... // ...args what this does is that rest operator creates an array and calls it args const secondSum = (...args) => args.filter(num=> Number.isInteger(num) && num > 0) .map(x => x**2) .reduce((acc, currVal)=>acc+currVal, 0) console.log("arrow higher order sum using rest operator: " + secondSum(1,2,3)) // spread operator looks exactly like rest operator. three dots. // but it expands an already existing array. So, it takes an array and spreads it out // into its individual parts // you can only use spread operator in an arguement to a function or in an array literal const myArray = [1,2,3] console.log("arrow higher order sum using rest and spread operator: " + secondSum(...myArray)) myArrayCopy = [...myArray] // Destructuring // its a way to neatly assign values taken from an object, to variables var voxel = {x:3.6, y:7.4, z:6.4} // we wish to get values contained inside voxel object // old way var a = voxel.x var b = voxel.y var c = voxel.z // using destructuring. we are creating three variables a, b and c and // assigning them values in x, y and z properties of the object const {x:a1, y:b1, z:c1} = voxel // a = 3.6, b = 7.4 and c = 6.4 const {x, y, z} = voxel console.log(`shortcut destructuring: x:${x} y:${y} z:${z}`) // nested destructuring. We will destructure nested objects const myNestedObj = { entry1: { first:"entry1-first", second:"entry1-second" }, entry2: { first:"entry2-first", second:"entry2-second" } } const { entry1: { first: entry1First}} = myNestedObj console.log(`nested destructuring: entry1First:${entry1First}`) // use destructuring assignment to assign variables from arrays // the difference between destructuring from an array to destructuring from an object // is that in case of array, we cannot specify what object to pick. It just goes in // accordance to the order. const [a2, b2] = [1,2,3,4] // only first two elements will be destructured. rest are omitted. console.log(`a1:${a2} b1:${b2} array destructuring`) // use destruturing assignment with rest operator const source = [1,2,3,4,5,6,7] // I want to omit first two and capture the rest in an array const [,,...myarr1] = source console.log(`destruturing with rest operator: myarr1:${myarr1}`) // use destructuring objects to pass in function arguments const myobj = { min: "min-val", max: "max-val", letter: "letter-val", better: "better-val" } const myFunc = ({ min, max }) => { console.log(`destructured objects in function args: min:${min} max:${max}`) } myFunc(myobj) // write consise object literal declarations using simple fields // say that we have a function that creates an object and // the object literal has key, value pairs like so: // long way const createPerson_longWay = (name, age, gender) => { return { name: name, age: age, gender: gender } } // short way const createPerson_shortWay = (name, age, gender) => ({name, age, gender}) console.log(createPerson_longWay('Ting_name long way', 20, 'ting_gender long way')) console.log(createPerson_shortWay('Ting_name short way', 20, 'ting_gender short way')) // write consise declarative functions // explanation: an object can contain a function // long way to put a function within an object const bicycle_long_way = { gear: 2, setGear: function(newGear){ "use strict" this.gear = newGear } } bicycle_long_way.setGear(3) console.log(`bicycle long way: ${ bicycle_long_way.gear }`) // short way to put a function within an object const bicycle_short_way = { gear: 2, setGear(newGear){ "use strict" this.gear = newGear } } bicycle_short_way.setGear(3) console.log(`bicycle short way: ${ bicycle_short_way.gear }`) // use class syntax to define a constructor function // ES6 provides syntactic sugar to help create objects using class keyword // older way to create an object var SpaceShuttle_old = function(targetPlanet){ this.targetPlanet = targetPlanet } // here the above function is essentially a constructor function that creates an // object via new keyword as shown below var zeus = new SpaceShuttle_old('Jupiter') console.log(`old way without class: ${zeus.targetPlanet}`) // class syntax replaces the constructor function creation class SpaceShuttle { constructor(targetPlanet){ this.targetPlanet = targetPlanet } } var new_zeus = new SpaceShuttle('Jupiter new') console.log(`new way with class: ${new_zeus.targetPlanet}`) // use getters and setters to control access to an object // getters and setters, although implemented as function, act like properties // when accessed class Book{ constructor(name){ this._name = name } get name(){ return this._name } set name(updatedName){ this._name = updatedName } } var book = new Book('Godzilla') console.log(`constructed book name: ${book.name}`) book.name = 'updated Godzilla' console.log(`updated book name: ${book.name}`) // difference between import and require // require was the old way of importing functions/variables from another file // import and export are new ES6 syntax to import/export only certain parts of an external file |
No Comments
You can leave the first : )