代码来源：https://developers.weixin.qq.com/miniprogram/dev/api/open-api/user-info/wx.getUserInfo.html

Page({
  data: {
    canIUse: wx.canIUse('button.open-type.getUserInfo')
  },
  onLoad: function() {
    // 查看是否授权
    wx.getSetting({
      success (res){
        if (res.authSetting['scope.userInfo']) {
          // 已经授权，可以直接调用 getUserInfo 获取头像昵称
          wx.getUserInfo({
            success: function(res) {
              console.log(res.userInfo)
            }
          })
        }
      }
    })
  },
  bindGetUserInfo (e) {
    console.log(e.detail.userInfo)
  }
})

问题：

1. data: {
    canIUse: wx.canIUse('button.open-type.getUserInfo')
  },
其中data是对象，canIUse表示属性？wx.canIUse('button.open-type.getUserInfo')表示属性对应的值？
这段代码的具体含义是什么？能够实现什么功能？

2.bindGetUserInfo (e) {
    console.log(e.detail.userInfo)？

①bindGetUserInfo是函数名？e是参数？如果是参数，是实参还是形参？

②为什么一定要用e？

③e.detail又是什么意思？

④有种说法这是回调函数？可以解释一下具体含义或者出处？

⑤为什么看了JavaScript，感觉还是有点不太理解小程序js文件部分，下一步应该怎么学习？可以提供参考书目或者学习文章或者系统性的学习路径和方案吗？
尤其是是以上这两点问题
请大佬解答！