似乎无法理解此JavaScript代码！ if（！this.class）

这里新来javascript。似乎无法理解此JavaScript代码！ if（！this.class）

所以我一直在尝试学习使用Raphael.js，并遇到了这个http://jsfiddle.net/terryyounghk/AeU2r/代码片段。

现在，如果你看第167行，有这个“如果”的陈述，我只是不明白。

Raphael.el.style = function (state, style, aniOptions) 
    { 
    if (!this.class) 
    { 
     this.class = style ? style : 'default'; 
     this.aniOptions = aniOptions ? aniOptions : null; 

     // start assigning some basic behaviors 
     this.mouseover(function() { this.style('hover'); }); 
    ....

什么类？它回来了什么？谁回来了？

它甚至检查什么？这是一堂课？

来源

2013-01-13 dirtyblankets

在if语句的正上方输入console.log（this）;并激活浏览器控制台。然后重新运行jsFiddle查看对象。 – arttronics

请注意，'class'是JavaScript中的[保留关键字]（https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Reserved_Words），因此代码看起来有点不礼貌。我不会在JavaScript中使用'class'作为属性名称，以避免将来的ECMAScript版本混淆。 – RichardTowers

它只是检查'this'的'class'属性是否具有（falsy）值。如果您不熟悉对象，请查看https://developer.mozilla.org/en-US/docs/JavaScript/Guide/Working_with_Objects。 –

它检查是否定义了一个属性class，如果没有，它会将它分配给style ? style : 'default'。

来源

2013-01-13 10:40:30 asgoth

“你也可以把它写成”---好吧，它不等于'if（！this.class）'的100％。我会从答案中删除。 – zerkms

你看到的是一个简单的条件语句，看它作为检查是否style计算结果为真或假，如果这是真的this.Class将有style的值，如果它不是一个简短的if-else子句它会得到值'default'。

我不知道raphael.js是如何工作的，但它在我看来只是一个html元素类。

来源

2013-01-13 10:42:20

*再次检查此类文件是否为false * ... uhm，否？它检查'style'是否是虚假的或真实的。它*将结果赋给'this.class'。总的来说，它的确如下：*“如果'this.class'没有值，那么赋值'style'如果它有一个值，否则''default''并做一堆其他的事情。”* –

@FelixKling感谢指出我答案中“非常糟糕”的部分。 –

从Raphael documentation,Raphael.el是一种将自己的方法添加到Raphael.element类的方法。一般来说，这个类的目的是为了更容易操纵SVG元素。代码示例中的

this.class与在前面的句子中使用的编程意义上的单词类无关。也不是（据我所知）是标准拉斐尔框架的一部分。它也不涉及HTML和SVG元素可以具有的class属性，也不涉及通过JavaScript使用element.className或element.setAttribute('class', '...')访问的属性。

this指元素包装对象（的Raphael.element一个实例），它似乎是谁写的这个方法的人简直所使用的名称class存储在元素包装一些额外的信息。（正如在评论中指出，这可能是一个坏主意，因为class是在JavaScript中的保留关键字，但无论如何，它的工作原理。）

具体而言，在本例中，this.class最初undefined，因为它没有被分配价值拉斐尔或代码中的其他地方。在if子句中，!undefined的计算结果为true，并且在以下行中，style的函数未传递任何值，因此style ? style : 'default'的计算结果为'default'。因此this.class被赋予值'default'。之后，如果右键单击某个形状并选择使用自定义样式，则该形状的class将变为“自定义”。

请注意，JavaScript非常容易让您引用并分配值，但尚未在任何地方初始化的对象的属性。它不会抛出错误，只是返回undefined，如果没有赋值。

您可以通过插入记录是怎么回事对浏览器控制台一行看到这一切：

console.log('style', state, style, aniOptions, this, 'class:', this.class);

，然后使用浏览器的开发者工具查看输出（JSFiddle）。

来源

2013-01-13 15:21:47 Stuart

+1优秀的答案。 – coderLMN

很好的回答！非常感谢你启发我。 – dirtyblankets

@hellokc很高兴帮助...随时接受这个答案，除非你支持更多的答案。 – Stuart

似乎无法理解此JavaScript代码！ if（！this.class）

回答

相关问题