2

今、私は使用しています

var lifeIcon = new Image();
lifeIcon.src = "img/System/lifeIcon.png";

1行で同じことを行う方法はありますか?

私は試した

var lifeIcon = (new Image()).src = "img/System/lifeIcon.png";

しかし、うまくいきません。lifeIcon は文字列と見なされます...

ありがとう。

注：私は非常に多くの画像を持っています。私の目標は、イメージをキャンバスで使用することです。元：ctx.drawImage(lifeIcon,0,0)

解決：

function newImage(src){
    var tmp = new Image();
    tmp.src = src;
    return tmp
}

var lifeIcon = newImage("img/System/lifeIcon.png");
var closeIcon = newImage("img/System/closeIcon.png");
var goldIcon = newImage("img/System/goldIcon.png");
...

注: 特に画像が多いため、個人的には、そのように書く方が速く、読む方が速いと感じています。

4

3 に答える 3

4

それは、あなたが次に何をするかにかかっています。他に必要なのは追加だけである場合は、次のようにすることができます。

element.appendChild(new Image()).src = "img/System/lifeIcon.png";

これ.appendChild()は、新しく追加された要素を返すため機能します。

他のプロパティを割り当てる必要がある場合は、プロパティと値を保持するオブジェクトを渡すことができるヘルパー関数を作成するだけで済みます。

function create(name, props) {
    var elem = document.createElement(name);
    for (var p in props)
        elem[p] = props[p];
    return elem;
}

これは非常に単純な関数であり、少し拡張することもできますが、アイデアは理解できます。

var el = create("img", {src: "img/System/lifeIcon.png"});
于 2013-08-31T21:23:06.510 に答える
1

まあ、ではありませんvar。それがグローバルである場合、これを行うことができます：

(lifeIcon = new Image()).src = "img/System/lifeIcon.png"; // WARNING: VERY BAD

明らかに、グローバルを最小限に抑えたいので、これは悪い考えです。

src実際には、コードを読みにくくするので、1 行に を割り当てるという全体的な考えはとにかく悪い考えです。コードを書くよりもコードを読むことに多くの時間を費やすことになるので、2 行の形式を使用してください。未来のあなたはあなたに感謝します。

于 2013-08-31T21:25:14.477 に答える
0

Image 関数を変更したり、そのような外部関数を作成したりせずに行うのは困難です。

function img(src) {
  var img = new Image(); img.src = src;
  var canvas = document.createElement("canvas");
  var returning = img.onload = function() {
    canvas.width = img.width;
    canvas.height = img.height;
    canvas.getContext("2d").drawImage(img, 0, 0);
    return canvas;
  }();
  return returning;
}

これにより、キャンバスを別のキャンバスに描画する準備が整います。

ctx.drawImage(img("background.jpg"), 0, 0);

あるいは単に

var image = img("background.jpg"); #will give you a canvas

one_lining で他に試すことができることは次のとおりです

var image = function() { var img = new Image(); img.src = "background.jpg"; return img; }();

私の意見では、1 回または 2 回呼び出す場合にのみ 1 つのライニングが完璧ですが、これを頻繁に使用する場合は、単純に関数を作成する方が適切です。

頑張ってください^^

于 2016-10-21T21:55:53.720 に答える