foop.js 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155
  1. //Person Constructor
  2. {
  3. class Person {
  4. constructor(name,surname){
  5. this.name = name
  6. this.surname = surname
  7. }
  8. getFullName(){
  9. if(this.fatherName){
  10. return `${this.name} ${this.fatherName} ${this.surname}`
  11. }
  12. else{return `${this.name} ${this.surname}`}
  13. }
  14. }
  15. const a = new Person("Вася", "Пупкин")
  16. const b = new Person("Анна", "Иванова")
  17. const c = new Person("Елизавета", "Петрова")
  18. console.log(a.getFullName()) //Вася Пупкин
  19. a.fatherName = 'Иванович'
  20. console.log(a.getFullName()) //Вася Иванович Пупкин
  21. console.log(b.getFullName()) //Анна Иванова
  22. }
  23. //Person Prototype
  24. {
  25. function createPerson(name,surname){
  26. class Person {
  27. constructor(name,surname){
  28. this.name = name
  29. this.surname = surname
  30. }
  31. getFullName(){
  32. if(this.fatherName){
  33. return `${this.name} ${this.fatherName} ${this.surname}`
  34. }
  35. else{return `${this.name} ${this.surname}`}
  36. }
  37. }
  38. return new Person(name, surname)
  39. }
  40. const a = createPerson("Вася", "Пупкин")
  41. const b = createPerson("Анна", "Иванова")
  42. const c = createPerson("Елизавета", "Петрова")
  43. console.log(a.getFullName()) //Вася Пупкин
  44. a.fatherName = 'Иванович'
  45. console.log(a.getFullName()) //Вася Иванович Пупкин
  46. console.log(b.getFullName()) //Анна Иванова
  47. }
  48. //Store
  49. {
  50. function createStore(reducer){
  51. let state = reducer(undefined, {})
  52. let cbs = []
  53. function Store(){
  54. this.getState = () => state
  55. this.subscribe = cb => (cbs.push(cb), () => cbs = cbs.filter(c => c !== cb))
  56. this.dispatch = action => {
  57. const newState = reducer(state, action)
  58. if (newState !== state){
  59. state = newState
  60. for (let cb of cbs) cb()
  61. }
  62. }
  63. }
  64. return new Store()
  65. }
  66. }
  67. //Password
  68. {
  69. function Password(parent, open) {
  70. let input = document.createElement('input')
  71. let checkBox = document.createElement('input')
  72. checkBox.type = 'checkbox'
  73. parent.append(input, checkBox)
  74. this.setValue =(value)=> input.value = value
  75. this.setOpen =(open)=> input.type = open ?'text':'password'
  76. this.getValue =()=> input.value
  77. this.getOpen =()=> input.type
  78. checkBox.onchange =()=>this.setOpen(checkBox.checked)
  79. }
  80. let p = new Password(document.body, true)
  81. p.onChange = data => console.log(data)
  82. p.onOpenChange = open => console.log(open)
  83. p.setValue('qwerty')
  84. console.log(p.getValue())
  85. p.setOpen(false)
  86. console.log(p.getOpen())
  87. }
  88. //LoginForm
  89. {
  90. function Password(parent, open) {
  91. let inputPass = document.createElement('input')
  92. let inputLogin = document.createElement('input')
  93. let checkBox = document.createElement('input')
  94. let button = document.createElement('button')
  95. button.innerText='Войти'
  96. button.disabled=true
  97. checkBox.type = 'checkbox'
  98. parent.append(inputPass,inputLogin,checkBox,button)
  99. this.setValue =(value)=> inputPass.value = value
  100. this.setOpen =(open)=> inputPass.type= open ?'text':'password'
  101. this.getValue =()=> inputPass.value
  102. this.getOpen =()=> inputPass.type
  103. checkBox.onchange =()=>this.setOpen(checkBox.checked)
  104. function btn (){
  105. if(inputPass.value && inputLogin.value){
  106. button.disabled=false
  107. }
  108. else{
  109. button.disabled=true
  110. }
  111. }
  112. inputPass.oninput = btn
  113. inputLogin.oninput = btn
  114. }
  115. let p = new Password(document.body, true)
  116. p.onChange = data => console.log(data)
  117. p.onOpenChange = open => console.log(open)
  118. p.setValue('qwerty')
  119. console.log(p.getValue())
  120. p.setOpen(false)
  121. console.log(p.getOpen())
  122. }