PhoneGap and Javascript OOP

PhoneGap and Javascript OOP

本文关键字：OOP Javascript and PhoneGap      更新时间：2023-09-26

我开始与phonegap，也试图应用JavaScript OOP与它。但问题是方法调用之类的。想象一下:
我在JavaScript中有一个主控制器，这个文件试图控制网络调用，数据库之间的大部分工作流程，更改视图。
这是我的main.js。

var onlineStatus = false;
var mainModel;
var connectTo = "http://192.168.1.65/mobile/service/";
document.addEventListener("deviceready", onDeviceReady, false);
document.addEventListener("online", online, false);
document.addEventListener("offLine", offline, false);
function whenOnline() {
    setOnline(true);
}
function whenOffline() {
    setOnline(false);
}
function onDeviceReady() {
    mainModel = new MainModel();
    mainModel.openDatabase();
    mainModel.startApplication();
}

和mainModel是这样的:

function MainModel() {
    this.isOnline = false;
    this.database = null;
    this.login = null;
    this.getDatabase = function() {
        return this.database;
    };
    this.openDatabase = function() {
        this.login = new LoginModel();
        this.database = window.openDatabase("wayacross", "0.2", "Test DB", 1000000);
    };
    this.startApplication = function() {
        this.database.transaction(this.login.checkLogin, goLoggin);
    };
}

和登录模型:

function LoginModel() {
    this.loginError = function() {
        navigator.notification.alert('Login Error', // message
        null, // callback
        'Login', // title
        'Done'                  // buttonName
        );
        goLogin();
    };
    this.isLogged = function(tx, results) {
        //ajax code
    };
    this.checkLogin = function(tx) {
        alert('checkLogin: Variable TX = '+ tx);
        tx.executeSql('SELECT * FROM login', [], this.isLogged, this.loginError);
    };
}

这是我现在控制开始工作流程的代码。问题是当我调用mainModel.js this.database.transaction(this.login. transaction)时。它不会做任何事情。当我将this.login.checkLogin更改为this.login.checkLogin()时，它可以工作，但tx变量未定义。

我可能在这里做错了什么，但我不知道为什么。也许phonegap不支持JavaScript OOP，我不太相信这一点。

你能帮忙吗?

提前感谢，
Elkas

问题是，当您说this.login.checkLogin时，您正在获得对函数的引用，但失去了对对象 this.login的引用，您希望与该函数关联。这是Javascript的基本属性之一，你必须完全理解，否则你在使用Javascript时总是会感到困惑。

这正是Function.prototype.bind的作用。它在旧的浏览器中是不可用的(所以大多数Javascript框架都有自己的实现)，但是因为你使用的是PhoneGap，你可能瞄准了一个现代的移动WebKit浏览器。

Function.prototype.bind所做的是将一个函数和一个对象捆绑在一起，形成一个自包含的"方法引用"。在内部，方法引用只是一个函数，它将原始函数作为对象的方法调用。

你可以这样使用它: 

this.database.transaction(this.login.checkLogin.bind(this.login), goLoggin);

再一次，你所说的是"将checkLogin绑定到this.login并将其作为方法引用还给我，而不仅仅是作为一个分离的函数"。

(巧合的是，我发明了Function.prototype.bind。我在一篇名为"通过Javascript的部分应用程序进行面向对象事件侦听"的旧文章中描述过它，它是Prototype中包含的首批实用程序之一，现在它在ECMAScript 5中被标准化了。要获得更详细的解释，您可以在某处找到那篇文章。
相关文章：