js function

class.js

 class Book {
   constructor(title, author, year) {
     this.title = title
     this.author = author
     this.year = year
   }
   getAge = () => {
     console.log(this)
     const years = new Date().getFullYear() - this.year
     return `${this.title} is published for ${years} years`
    }
   //getAge(){
   //  console.log(this)
   //  const years = new Date().getFullYear() - this.year
   //  return `${this.title} is published for ${years} years`
   // }
   
   revise(newYear) {
    this.year = newYear
    this.revised = true
   }

   static topBookStroe() {
    return 'Best Book store'
   }
 }

const book1 = new Book('book one', 'john doe', 2014)
console.log(book1.getAge())

Book.topBookStroe()

// subclass

class Magazine extends Book {
 constructor(title, author, year, month) {
  super()
  this.month = month
 }
}

const mag1 = new Magazine('Mag One', 'Jogn', '2019', 'Jan')

dataType.js

// primitive type
let x = 10
let y = x

x = 20 // y is 10, x is 20

// object or reference type
let x = { value: 10 }
let y = x

x.value = 20 // x === y === {value:10}

// conclusion:
// Primitives are copied by their value
// Objects are copied by their reference


let number = 10

function increment(number) {
  number++
}

increment(number)
console.log(number) // 10

let obj = { value: 10 }

function increment(obj) {
  obj.value++
}

increment(obj)
console.log(obj) // { value: 11 }

enumerating.js

function Circle(radius) {
  this.radius = radius
  this.draw = function() {
    console.log('Draw')
  }
}

const circle = new Circle(19)

for (let key in circle) {
  if (typeof circle[key] !== 'function')
    console.log(key, circle[key])
}

const keys = Object.keys(circle)

if ('radius' in circle)
  console.log('Circle has a radius')

functions.js

// Factory Function
function createCircle(radius) {
  return {
    radius,
    draw: function() {
      console.log('draw')
    }
  }
}

const circle = createCircle(1)


// Constructor Function
function Circle(radius) {
  this.radius = radius
  this.draw = function () {
    console.log('draw')
  }
}

// when using `new` operator 3 things happen
// 1. create a new empty object like {}
// 2. point `this` to this object rather than root object(window or global)
// 3. return `this`

const another = new Circle(1)
// same same
Circle.call({}, 1)

// if want to pass an array
Circle.apply({}, [1,23,4,5])

getterSetter.js

function Circle(radius) {
  this.radius = radius
  this.draw = function() {
    console.log('Draw')
  }
  
  // expose to outside too much, easily changable
  this.defaultLocation = { x: 0, y:0 }
  
  // can not access from outside
  let defaultLocation = { x: 0, y: 0 }
  
  // accessible from outside, unchangable, but need call a function
  this.getDefaultLocation() {
    return defaultLocation
  }
  
  // best solution
  Object.defineProperty(this, 'defaultLocation', {
    get: function() {
      return defaultLocation
    },
    set: function(value) {
      if (!value.x || !value.y)
        throw new Error('invalid location')
      defaultLocation = value
    }
  }
}

manipulateObj.js

function Circle(radius) {
  this.radius = radius
  this.draw = function() {
    console.log('Draw')
  }
}

const circle = new Circle(10)

circle.location = { x: 1 }
// bracket notaion same same
circle['location'] = { x: 1 }

const propertyName = 'center-location'
circle[propertyName] = { x: 1 }

// delete
delete circle.location // delete circle['location']

prototype.js

function Book(title, author, year) {
  this.title = title
  this.author = author
  this.year = year

  // constructor
  //   this.getSummary = function () {
  //     return `${this.title} was written by ${this.author} in ${this.year}`
  //   }
}

// prototype
Book.prototype.getSummary = function () {
  return `${this.title} was written by ${this.author} in ${this.year}`
}

Book.prototype.getAge = () => {
  console.log(this)
  const years = new Date().getFullYear() - this.year
  return `${this.title} is published for ${years} years`
}

const book1 = new Book('Book one', 'John Doe', '2013')
const book2 = new Book('Book two', 'Jane Doe', '2016')

console.log(book1.getSummary())

stopwatch.js

const sw = new Stopwatch()

function Stopwatch() {
  let startTime, endTime, running, duration = 0
  
  this.start = function() {
    if (running)
      throw new Error('stopwatch has already started')
    running = true
    startTime = new Date()
  }

  this.stop = function() {
    if (!running)
      throw new Error('stopwatch is not started')
    running = false
    endTime = new Date()
    const seconds = (endTime.getTime() - startTime.getTime()) / 1000
    duration += seconds
  }
  
  this.reset = function() {
    startTime = null
    endTime = null
    running = false
    duration = 0
  }
  
  Object.defineProperty(this, 'duration', {
    get: function() {return duration}
  })
}

this.js

// `this`: The object that is executing the current function

// method -> obj
// function -> global (window, global) 

const video = {
  title: 'a',
  play() {
    console.log(this)
  }
}

video.play() // this -> video object

function video(title) {
  console.log(this)
}

video() // this -> root object

// for constructor function
function Video(title) {
  this.title = title
  console.log(this)
}

const vi = new Video('B') 
// when using new operator, create a new empty object like {}
// then excute this.title = title
// return this, that is { title: "B" }

const video = {
  title: 'a',
  tags: ['a', 'b', 'c'],
  showTags() {
    this.tags.forEach(function(tag) {
      console.log(this, tag)
    })
  }
}

video.showTags() // this is window, because `function(tag) { console.log(this, tag) }` is a normal function not a method
// solution: pass this to second parametor to forEach

showTags() {
  this.tags.forEach(function(tag) {
    console.log(this, tag)
  }, this)
}

tricky.js

// 1 
console.log(2 + '2')
console.log(2 - '2')

// 2 find unique
let nums = [1,3,5,4,4] // get [1,3,5,4]
[...new Set(nums)]

// 3 var vs let
let func = function() {
  {
    let l = 'let'
    var v = 'var'
  }
  
  console.log(v)
  console.log(l)
}
func()

// 4
console.log(5 < 6 < 7) // true, reason: step one 5 < 6 is true, step two: true < 7 is true
console.log(7 > 6 > 5) // false

// 5
let a = () => arguments
console.log(a('HI')) // ERROR

let a = (...aaa) => aaa
console.log(a('HI')) // ['HI']

let a = function() { return arguments }
console.log(a('HI')) // Arguments{ ['HI'], ...}

// 6
let x = function() {
  return
  {
    message: 'hi'
  }
}

console.log(x()) // undefined
// same with 
// return;
// { message: 'hi' };
funciton x() {
  return { 
  message: 'hi'
  }
}
console.log(x()) // hi

// 7
let profile = {
  name: 'fuccc'
}

// don't let others do anything with this object
Object.freeze(profile)

// not allow to add new property but allow to modify existed properties
Object.seal(profile)

profile.name = 'fjdkslfjs'

console.log(profile)

// name is changable, age only readable
let profile = {
  name: 'fds',
}

Object.defineProperty(profile, 'age', {
  value: 3,
  writable: false
})

// Math.max
console.log(Math.max(1,3,5)) // 5
console.log(Math.max()) // -Infinity