Blogger Information
Blog 94
fans 0
comment 0
visits 92718
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
【JS】 JS 函数参数:多值返回-对象封装
可乐随笔
Original
832 people have browsed it

JS 函数参数

  1. let f = (a, b) => `${a}+${b}=${a + b}`
  2. console.log(f(1, 2))
  3. console.log('----------------')

1. 参数不足

  1. f = (a, b = 10) => `${a}+${b}=${a + b}`
  2. console.log(f(1))
  3. console.log('----------------')

2. 参数过多: …(rest)

  1. f = (a, b, ...arr) => arr
  2. console.log(f(1, 2, 3, 4, 5))
  3. f = (...arr) => arr
  4. console.log(f(1, 2, 3, 4, 5))
  5. f = (...arr) => arr.reduce((acc, cur) => acc + cur)
  6. console.log(f(1, 2, 3, 4, 5, 6))
  7. // ? ... 用在参数中是压入数组,用在数组中是"展开"操作
  8. let args = ['HTML', 'css', 'js']
  9. console.log(`已学了 ${[...args]} 课程`)
  10. console.log('=========================')

3.多值返回

  • 遇到return 即返回,忽略后面的代码
  • return 只返回一个数据,即’单值返回’
  • 前面所有演示都是单值返回,下面演示多值返回
  1. function a() {
  2. return 'aaa'
  3. console.log('bbbb')
  4. }
  5. console.log(a())
  6. // ?其实""多值返回"还是返回单位,只不过返回的是一个集成或数组的"引用类型"
  7. // ?常用多值返回的引用类型:数组 和对象,或二都兼有
  8. // 1. 返回一组商品信息
  9. const items = () => [
  10. { id: 1, name: '笔记本' },
  11. { id: 2, name: '打印机' },
  12. { id: 3, name: '手机' }
  13. ]
  14. console.log(items())
  15. // 2. 对象返回一些信息
  16. // 模板封装(IIFE)立即执行函数
  17. const user = ((uname, email) => ({
  18. uname,
  19. email,
  20. print() {
  21. return `${this.uname}:${this.email}`
  22. }
  23. }))('老李', 'nx99@qq.com')
  24. console.log(user.uname)
  25. console.log(user.email)
  26. console.log(user.print)

为什么要多此一举呢,为什么不直接定义一个user对象呢?

  1. 立即执行函数创建的是临时作用域,不会污染全局环境,(对全局隐身)
  2. 用户拿到时,模块已经有了初始状态,即已具备可用的属性和方法
  3. 对于用户来说,模块是一个对象,其实模块是一个函数
  4. 函数是有作用域的,所以模块也有了作用域,关于模块作用域,后面有介绍
  5. 实际工作的模块比这个复杂的多,更多采用””注入式”,感兴趣同学,可以进阶

总结

1.参数不足:默认参数
2.参数过多: …rest
3.多值返回: 数组,对象

Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post