Understanding JS scope in promise call back: Update Vuejs property in promise call back (capturing 'this' in closure )

update_vue_prop_in_promise.vue

/*
* There are about 2 ways to do tis
*/

import firebase from 'firebase'

export default {
    name: "SignUp",
    data: () => ({
      successAlert: false,
      errorAlert: false,
      email: '',
      password: ''
    }),
    
    methods: {
    // METHOD 1
       signup: function() {
        firebase.auth().createUserWithEmailAndPassword(this.email, this.password).then(
        function(user){
          this.successAlert = true

        }.bind(this), // same here
        function(err){
          this.errorAlert =  true
        }.bind(this) //capture 'this' in closure to allow variables in  and out of promise
                     // without binding, you get error: Uncaught TypeError: Cannot set property 'errorAlert' of undefined
      )
    },
    // METHOD 2, introducing self
     signup: function() {
        var self = this
        firebase.auth().createUserWithEmailAndPassword(this.email, this.password).then(
        function(user){
          self.successAlert = true

        }
        function(err){
          self.errorAlert =  true
        }
      )
    },
    
   
    }

  }