这个CanvasJS代码行的目的是什么?

时间:2017-03-13 22:49:21

标签: javascript canvas graph canvasjs

我正在使用CanvasJS并且总是在这里使用这些行:

var chart = new CanvasJS.Chart("chartContainer",
   {
    ...
    });
    chart.render();

不幸的是,我不知道这些线路在做什么。有人可以向我解释一下吗?非常感谢你!

1 个答案:

答案 0 :(得分:6)

这些线路在做什么?

好吧,他们自己并不多。在javascript引擎的上下文中很多或不多。

简短版本。

创建并呈现CanvasJS.Chart,将图表放在标识为" chartContainer"的DOM元素中。好吧,如果它完成了。

长版本。

  • var是一个JavaScript令牌。它用于声明变量,通常后跟变量的名称或变量标识符。在这种情况下chart。您还可以使用具有不同范围和权限的令牌letconstfunction(和其他一些),以及他们声明的变量的内容

  • =是一个赋值运算符。它将数据从右侧的表达式移动到左侧的变量/属性。

  • new(javascript标记)是一种特殊的标记,可以修改函数的调用方式(在旧的时候,当javascript仍被视为玩具时,它被用来使javascript看起来很时髦而且很酷)它在语言中非常超级,所以你现在可以忽略它。

  • CanvasJS(变量标识符)是使用其中一个声明令牌(很可能是function)在javascript代码(希望)中的某处声明的变量。资本化很重要。在Javascript中,当您对变量标识符进行大写时,您告诉全世界这是一个特殊函数,如果被调用它将始终返回Object。它还告诉您它可能有一个名为prototype的特殊属性,它可以帮助javascript引擎更快地运行代码,并通过使用称为继承的东西简化数据结构来帮助您。

  • .Chart(属性标识符)这是一个属性,即点"。"在CanvasJSChart之间表示属性(称为Dot符号,但同样可能不是那么受欢迎,Bracket符号CanvasJS["Chart"]CanvasJs.Chart相同。)

    因此ChartCanvasJS的属性。属性就像一个变量,而不是单独将属性附加到Object。这对于分组相关数据和信息非常方便

    由于CanvasJS具有较大的C,Chart最有可能(但不确定)CanvasJS的特殊原型属性之一。

  • (打开大括号。当您在变量标识符后面看到其中一个时,意味着该变量是一个可以调用的函数。它在某些时候必须有一个右括号) ()之间的内容称为函数参数或参数,并传递给函数。有一整套规则来管理(和)之间的内容以及现在要涵盖的内容。

    调用函数做了很多特殊的事情,最基本的术语是javascript引擎定位属于该函数的代码,用参数打包,转到函数代码,设置camp,执行函数代码然后返回所有的格罗夫假日镜头。无论如何我离题

  • "chartContainer"第一个参数,一个字符串文字。它抽象地是一个专门的记忆,它拥有一个"字符串"的人物。字符串和字符串文字有很多用途,但看看这个字符串的内容,我可以猜出它的用途。

    这是一个用于查找DOM对象的标识符,名称或查询(文档对象模型,javascript方面的丑陋位置,其聚会Javascript来自但没人喜欢和希望的人将会消失)将保留图表的HTML位

  • ,逗号用于分隔参数(在本例中)

  • {打开卷曲或对象文字。像字符串文字一样,但它包含属性而不是字符。需要在某个时候闭卷曲

  • ...在这种情况下,这些点本身就是胡言乱语,会导致javascript解析器在其轨道中停止运行而不再查看代码。我们知道它是乱码,javascript也是如此,但规则是规则所以我们需要清理它。

  • //...评论了epsilon引用缺失的代码。

  • }关闭对象文字。

  • )结束了函数的参数列表。

  • 结束表达,就像new一样,它并不是真的需要,但是上帝(AKA Douglas Crockford)暗示它一定是这样,否则你将被JSLint和朋友的晦涩的错误和嘲讽所淹没。 (你也看不到返回字符,所以;告诉你这个语句/表达式/无块代码块是完整的。)

    此时javascript将调用函数CanvasJs.Chart传递参数,字符串和对象。该函数将完成它的事情并运气好会返回一个对象(我们知道它将是一个对象,因为new令牌和Chart有一个大的C)。 =会将变量标识为chart(请注意小c)对返回对象的依据。

  • chart.render()被称为chart的{​​{1}}所持有的引用对象的属性是一个函数,不带参数调用它。我猜它绘制了一个图表,并且该图表可以在DOM中看到可能具有id render的元素。