提高代码质量[Javascript / AngulaJS]

时间:2015-11-04 13:46:56

标签: javascript angularjs

我用scracth做了一个带有一些效果的旋转木马,我这样做了:

    $scope.intro = {
    index : 0,
    A : false,
    B : false,
    C : false,
    D : false,
    E : false,
    F : false,
    G : false,
    H : false,
    I : false,
    L : false,
    M : false,
    N : false
};

var intervallo = 4000;
var action = function(){
    $scope.intro.N = false;
    $scope.intro.A = true;
    $timeout(function () {
        $scope.intro.index++;
        $scope.intro.A = false;
        $scope.intro.B = true;
        $timeout(function () {
            $scope.intro.index++;
            $scope.intro.B = false;
            $scope.intro.C = true;
            $timeout(function () {
                $scope.intro.index++;
                $scope.intro.C = false;
                $scope.intro.D = true;
                $timeout(function () {
                    $scope.intro.index++;
                    $scope.intro.D = false;
                    $scope.intro.E = true;
                    $timeout(function () {
                        $scope.intro.index++;
                        $scope.intro.E = false;
                        $scope.intro.F = true;
                        $timeout(function () {
                            $scope.intro.index++;
                            $scope.intro.F = false;
                            $scope.intro.G = true;
                            $timeout(function () {
                                $scope.intro.index++;
                                $scope.intro.G = false;
                                $scope.intro.H = true;
                                $timeout(function () {
                                    $scope.intro.index++;
                                    $scope.intro.H = false;
                                    $scope.intro.I = true;
                                    $timeout(function () {
                                        $scope.intro.index++;
                                        $scope.intro.I = false;
                                        $scope.intro.L = true;
                                        $timeout(function () {
                                            $scope.intro.index++;
                                            $scope.intro.L = false;
                                            $scope.intro.M = true;
                                            $timeout(function () {
                                                $scope.intro.index++;
                                                $scope.intro.M = false;
                                                $scope.intro.N = true;
                                            }, intervallo);
                                        }, intervallo);
                                    }, intervallo);
                                }, intervallo);
                            }, intervallo);
                        }, intervallo);
                    }, intervallo);
                }, intervallo);
            }, intervallo);
        }, intervallo);
    }, intervallo);
};

$interval(function(){action()}, 1000, 1);
$interval(function(){action()}, (intervallo * 12) + 1000 );

现在,它运作良好,我很满意,但我只是想知道是否有更好的方法来编写它。 如果您想查看它的实际效果,可以在mobiliperufficio.com

中找到它

现在“新”代码是:

var alphaChars = "nabcdefghilmn".toUpperCase().split("");

$scope.intro = {};
$scope.intro.index = 0;
var intervallo = 4000;

var action = function(currentChar, nextChar, i) {
    $timeout(function() {
        $scope.intro[currentChar] = false;
        $scope.intro[nextChar] = true;
        $scope.intro.index = i;
    }, intervallo * i);
};

$interval(function () {
    for (var i = 0; i < alphaChars.length - 1; i++) {
        action(alphaChars[i], alphaChars[i + 1], i);
    }
}, 1000, 1);
$interval(function(){
    for (var i = 0; i < alphaChars.length - 1; i++) {
        action(alphaChars[i], alphaChars[i + 1], i);
    }
}, (intervallo * alphaChars.length) + 1000 );
非常感谢

1 个答案:

答案 0 :(得分:0)

你可以使用一个循环:

var alphaChars = "abcdefghijklmn".toUpperCase().split("");

$scope.intro.index++;
$scope.intro.A = false;
$scope.intro.B = true;

for (var i = 0; i < alphaChars.length - 1; i++) {
    (function(char, nextChar) {
        $timeout(function () {
            $scope.intro.index++;
            $scope.intro[char] = false;
            $scope.intro[nextChar] = true;
        }, intervallo);
    })(alphaChars[i], alphaChars[i + 1])
}