什么是新的Transform()?

时间:2015-11-16 12:10:51

标签: javascript jquery

我刚刚浏览了transit.js here上的代码。我遇到了以下几行代码:

$.cssHooks['transit:transform'] = {
    // The getter returns a `Transform` object.
    get: function(elem) {
        return $(elem).data('transform') || new Transform();
    },

    // The setter accepts a `Transform` object or a string.
    set: function(elem, v) {
        var value = v;

        if (!(value instanceof Transform)) {
            value = new Transform(value);
        }

        // We've seen the 3D version of Scale() not work in Chrome when the
        // element being scaled extends outside of the viewport.  Thus, we're
        // forcing Chrome to not use the 3d transforms as well.  Not sure if
        // translate is affectede, but not risking it.  Detection code from
        // http://davidwalsh.name/detecting-google-chrome-javascript
        if (support.transform === 'WebkitTransform' && !isChrome) {
            elem.style[support.transform] = value.toString(true);
        } else {
            elem.style[support.transform] = value.toString();
        }

        $(elem).data('transform', value);
    }
};

现在我通过查看jQuery文档here来找出$.cssHooks部分,但我不太明白的是Transform()到底是什么?

注意::我不是在问new是什么。

1 个答案:

答案 0 :(得分:2)

变换是一个用作构造函数的函数,它是defined here

// ## Transform class
// This is the main class of a transformation property that powers
// `$.fn.css({ transform: '...' })`.
//
// This is, in essence, a dictionary object with key/values as `-transform`
// properties.
//
//     var t = new Transform("rotate(90) scale(4)");
//
//     t.rotate             //=> "90deg"
//     t.scale              //=> "4,4"
//
// Setters are accounted for.
//
//     t.set('rotate', 4)
//     t.rotate             //=> "4deg"
//
// Convert it to a CSS string using the `toString()` and `toString(true)` (for WebKit)
// functions.
//
//     t.toString()         //=> "rotate(90deg) scale(4,4)"
//     t.toString(true)     //=> "rotate(90deg) scale3d(4,4,0)" (WebKit version)
//
function Transform(str) {
    if (typeof str === 'string') { this.parse(str); }
    return this;
}

Transform.prototype = {
    // ### setFromString()
    // Sets a property from a string.
    //
    //     t.setFromString('scale', '2,4');
    //     // Same as set('scale', '2', '4');
    //
    ...

所以在致电:

var transform = new Transform();

Transform的实例将存储在transform中,其中包含Transform.prototype提供的方法。