javascript - CanvasRenderingContext2D 的 Lis 属性

Question

您好，我正在尝试列出 CanvasRenderingContext2D 对象的所有方法和属性。我成功地列出了方法，但是当我尝试列出属性时，我得到了奇怪的结果。我得到的只是重复多次的相同属性的数组。有人可以帮我吗？

var canvas = document.querySelector('#canvas');
var ctx = canvas.getContext('2d');

 var methods = [];
        for (var m in ctx) {
            if (typeof ctx[m] == "function") {
                methods.push(m);
                methods.join(',');
            }
        }
        var methodsContainer = document.querySelector('#methods');
        for(var i = 0; i < methods.length; i++) {
            var opt = methods[i];
            var el = document.createElement("option");
            el.textContent = opt;
            el.value = opt;
            methodsContainer.appendChild(el);
        }
  var properties = [];
        for (var key in ctx) {
            if (Object.getOwnPropertyNames(ctx)) {
                properties.push(m);
                properties.join(',');
            }
        }

        var propertiesContainer = document.querySelector('#properties');
        for(var i = 0; i < methods.length; i++) {
            var opt = properties[i];
            var el = document.createElement("option");
            el.textContent = opt;
            el.value = opt;
            propertiesContainer.appendChild(el);
        }

  <canvas id="canvas"></canvas> 
  
  <h5>Methods</h5>
  <select id="methods">

  </select>
  <br/>
  <h5>Properties</h5>
  <select id="properties">

  </select>

Answer 1

这一行(声明属性变量后):

for(var i = 0; i < methods.length; i++) {

应该是:

for(var i = 0; i < properties.length; i++) {

当你应该循环属性时，你要循环方法具有值的次数

这一行还:

for (var key in ctx) {
        if (Object.getOwnPropertyNames(ctx)) {
            properties.push(m);
            properties.join(',');
        }
    }

当您可能打算按“key”时，您正在按 m 变量