时间戳

首页 > 解决方案 > 我正在尝试将我的函数调用存储在一个对象中

javascript - 我正在尝试将我的函数调用存储在一个对象中

问题描述

我试图将我的函数调用存储在一个对象中，所以当我引用该属性时，它会运行该函数。这是我写的代码，但它不起作用。到目前为止，这是我的代码。html:

<!DOCTYPE html> 
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Tetris(test)</title> 
    <link rel="stylesheet" href="styleSheets/main.css">
    <script src = "https://code.jquery.com/jquery-3.4.1.js"></script>
    <script src = "js/jquery.1.js"></script>
    <script src = "js/main.js"></script>
  </head>
  <body>
      <svg id="container" width= "500" height= "650" style= "background-color: black" position= "relative">
      </svg>

  </body>
</html>

JS：

var svgNS = "http://www.w3.org/2000/svg";
var htmlNS = "http://www.w3.org/1999/xhtml";

function createShape1() {
    var elem = document.getElementById("container");
    var shape = document.createElementNS(svgNS, "rect");
        shape.id = "shape1";
        shape.style.width = "150px";
        shape.style.height = "50px";
        shape.style.fill = "orange";
        shape.style.y = "50px";
        shape.style.x = "150px"
        shape.style.position = "absolute"
        elem.append(shape);
    var shape2 = document.createElementNS(svgNS, "rect");
        shape2.id = "shape2";
        shape2.style.fill = "orange";
        shape2.style.x = "200px";
        shape2.style.width = "50px";
        shape2.style.height  = "51px";
        elem.append(shape2);
};
window.onload = randShape;
function createShape2() {
    var elem = document.getElementById("container");
    var shape = document.createElementNS(svgNS, "rect");
    shape.id = "shape1";
        shape.style.width = "100px";
        shape.style.height = "100px";
        shape.style.fill = "red";
        shape.style.x = "200px"
        shape.style.position = "absolute"
        elem.append(shape);
};
var shapes = {
    "shape1": createShape1(),
    "shape2": createShape2()
};
function randShape() {
    var x = Math.floor(Math.random() * 2);
    shapes.x;
}

因此，如果您有任何建议让我的代码生成形状的随机属性，每个属性都应该生成自己的形状。

标签： javascripthtmlfunctionobjectproperties

解决方案

问题是如何在访问要调用的函数之前访问该值并进行函数调用

var shapes = {
  "shape1": createShape1,
  "shape2": createShape2
};

function randShape() {
    var x = Math.floor(Math.random() * 2) + 1;
    (shapes["shape" + x]).call(shapes);
}

推荐阅读