js中var值类型:
var a;
console.log("typeof a:", typeof a); //结果为undefined
a = undefined;
console.log("typeof a:", typeof a); //结果为undefined
a = 100;
console.log("typeof a:", typeof a); //结果为number
console.log("a instanceof Number:", a instanceof Number); //结果为false
a = "2.1";
console.log("typeof a:", typeof a); //结果为string
console.log("a instanceof String:", a instanceof String); //结果为false
a = true;
console.log("typeof a:", typeof a); //结果为boolean
console.log("a instanceof Boolean:", a instanceof Boolean); //结果为false
a = document.getElementById("btnHobbyAll");
console.log("typeof a:", typeof a); //结果为object
console.log("a instanceof Object:", a instanceof Object); //结果为true
a = null;
console.log("typeof a:", typeof a); //结果为object
a = [1, 2, 3];
console.log("typeof a:", typeof a); //结果为object
console.log("a instanceof Array:", a instanceof Array); //结果为true
在js中可以定义类似结构体的值:
var obj = {
num : 100,
s : "abc",
sex : true,
"abc" : function () {
return 1;
},
};
对其调用方法:
console.log("obj.num:", obj.num);
console.log('obj["num"]:', obj["num"]);
但上述两种对于定义的函数无法调用,对函数需要如下:
var res = obj["abc"]();
var res = obj.abc();
对结构体内未定义的成员进行调用,值为undefined
在js中,undefined在逻辑判断中类似于false,切在js的逻辑判断中,如||运算,前者真将会对该运算进行夹断,直接返回||前的值。
js中的等号:
普通==:普通值判断,不需要类型相同,如"1"==1=true
严格三等号:要求值、类型都相同
获取控件函数:
function getEle(str) {
if (arguments.length != 1 || typeof str != 'string') {
throw Error("参数个数或类型非法!");
}
var firstAlpha = str.substring(0, 1);
var ele;
if (firstAlpha == "#") {
ele = document.getElementById(str.substring(1));
} else if (firstAlpha == '@') {
ele = document.getElementsByName(str.substring(1));
} else if (firstAlpha == '*') {
ele = document.getElementsByTagName("*");
} else if (firstAlpha == '.') {
ele = document.getElementsByClassName(str.substring(1));
} else {
ele = document.getElementsByTagName(str);
}
return ele;
}
上述是简单的逻辑判断,但并未用到js的灵活性优势。
结合上述结构体,对组件获取进行一些优化:
var funs = {
"*" : function () {
return document.getElementsByTagName("*");
},
"#" : function (arg) {
return document.getElementById(arg.substring(1));
},
"." : function (arg) {
return document.getElementsByClassName(arg.substring(1));
},
"@" : function (arg) {
return document.getElementsByName(arg.substring(1));
},
};
var f = funs[str.substring(0,1)];
f = f || function (arg) {
return document.getElementsByTagName(arg);
}
return f(str);
上述给函数传入第一个字符,根据第一个字符调用相应函数。分别为:1.根据标签名获取控件 2.根据id获取控件 3.根据调用类名获取控件 4.根据名字获取控件
接着直接将函数放到返回值内调用:
function getEle(str) {
/*
getEle("*") 获取所有元素
getEle("#xxx") 获取以xxx为id值的元素
getEle(".yyy") 获取包含class的值为yyy的元素
getEle("tagName") 获取名为tagName的标签元素
getEle("@zzz") 获取name值为zzz的元素
*/
return ({
"*" : function () {
return document.getElementsByTagName("*");
},
"#" : function (arg) {
return document.getElementById(arg.substring(1));
},
"." : function (arg) {
return document.getElementsByClassName(arg.substring(1));
},
"@" : function (arg) {
return document.getElementsByName(arg.substring(1));
},
}[str.substring(0, 1)] || function (arg) {
return document.getElementsByTagName(arg);
})(str);
};
这一串首先隐藏性定义了一个值,包括了4个函数,该值会根据传入的str第一个字符进行判断,当调用失败返回undefined,会调用备用函数。