JavaScript基础语法与原型机制解析

JavaScript基础语法与逻辑运算

var a=false;

!a&&alert("hi");

此处逻辑为：当变量a为真时，表达式继续执行后续代码，因此会弹出提示框显示“hi”。

var a=a||"hi";

该语句用于设置默认值：当a为假时继续执行赋值操作，当a为真时则跳过该语句，从而实现默认值的复制逻辑。

需要注意的是，并非所有编程语言都采用相同的处理机制，例如PHP语言的行为就与此不同。

$a=@$a||"hi";

echo $a;//1

在PHP中，运算符(@$a||"hi")右侧的值会被赋值给变量$a。

$a=true;

!$a&&echo "hi";

上述代码会直接报错：syntax error, unexpected T_ECHO。

Prototype原型机制解析

关于prototype

在许多场景下，提到prototype往往让人联想到它仅存在于对象实例中。

var add=function(){alert("b");}

add.prototype.a = function () {alert("hi");}

new add.prototype.a;

初看可能会认为这会报错，但实际上并不会。在没有创建具体对象实例时，可以通过add.prototype.a的方式直接调用静态方法。

JavaScript的设计有时确实容易让人产生误解。

DOM节点获取与处理技巧

选择器问题:

有时需要获取某个节点下的子节点，使用childNodes属性在Firefox和IE浏览器中的表现差异令人困扰。

document.getElementsByTagName("head")[0].getElementsByTagName("script")[0];

上述方法在针对head标签时效果尚可，但在其他情况下应用效果并不理想。

因此，使用类名进行匹配处理可能是更好的选择。

 
function getclassnode(classname,doc){
doc=doc||document;
var node=[],i=0,j=0,t;
var allnode=doc.getElementsByTagName("*");
while(t=allnode[i]){
if(RegExp(classname).test(t.className)){
node[j]=t;
j++;
} 
i++;
} 
return node;
} 

脚本移除后的环境特性

自从使用jQuery后，原生JavaScript的操作技能有所生疏，偶尔复习感觉较为繁琐。

补充一点今日发现的JavaScript注意事项：如果一个JavaScript文件已经引入到当前文档中，即使移除引入该文件的节点，通过该文件定义的变量、函数等仍然有效，因为它们已经被加载到当前文档环境中。示例代码如下：

 
document.getElementsByTagName("head")[0].removeChild(document.getElementsByTagName("head")[0].getElementsByTagName("script")[0]);