弱类型语言javascript开发中的一些坑实例小结【变量、函数、数组、对象、作用域等】
本文实例讲述了弱类型语言javascript开发中的一些坑。分享给大家供大家参考,具体如下:
测试1:(未声明变量自动提升为全局变量)
test1(); functiontest1(){ functionsetName(){ name='张三';//此处没有var声明,提升至全局 } setName(); console.log(name);//'张三' }
测试2:(函数内部局部变量的变量提升)
test2(); functiontest2(){ vara=1; functionhaha(){ console.log(a); vara=1; } haha();//undefined }
测试3:(给window对象挂载属性,作用域提升至全局)
test3(); functiontest3(){ varb=2; functionhehe(){ window.b=3;//此时的b为全局变量的b console.log(b);//此时的b是函数test3()里的b为2 } hehe(); }
测试4:(变量提升,局部作用域的综合)
test4(); functiontest4(){ c=5; functionheihei(){ varc; window.c=3; console.log(c);//函数heihei内的c为undefined console.log(window.c);//3 } heihei(); }
测试5:(数组的长度的问题)
test5(); functiontest5(){ vararr=[]; arr[0]='1'; arr[1]='b'; arr[9]=100; console.log(arr.length);//10 }
测试6:(等与全等的问题)
test6(); functiontest6(){ vara=1; console.log(a++);//1 console.log(++a);//3 console.log(null==undefined);//true console.log(null===undefined);//false console.log(1=="1");//true console.log(1==="1");//false console.log(NaN===NaN)//false; }
测试7:(类型相关)
test7(); functiontest7(){ console.log(typeof1);//number console.log(typeof"hello");//string console.log(typeoftypeof"hello");//string console.log(typeof!!"hello");//boolean console.log(typeof/[0-9]/);//object console.log(typeof{});//object console.log(typeofnull);//object console.log(typeofundefined);//undefined console.log(typeof[1,2,3]);//object console.log(toString.call([1,2,3]));//[objectArray] console.log(typeoffunction(){});//function }
测试8:(parse函数相关)
test8(); functiontest8(){ console.log(parseInt(3.14));//3 console.log(parseFloat('3.01aaa'));//3.01 console.log(parseInt('aa1.2'));//NaN; console.log(parseInt('8.00',16));//8 console.log(parseInt('0x8',16));//8 console.log(parseInt('8.00',10));//8 console.log(parseInt('010',8));//10 console.log(parseInt('1000',2));//1000 }
测试9:(变量提升,函数提升与return后阻断执行)
test9(); functiontest9(){ functionbar(){ returnfoo; foo=10; functionfoo(){}; } console.log(typeofbar());//'function' }
测试10:(作用域与函数提升)
test10(); functiontest10(){ varfoo=1; functionbar(){ foo=10; console.log(typeoffoo); return; functionfoo(){}; } bar();//number console.log(foo);//1 }
测试11:(变量提升与函数提升)
test11(); functiontest11(){ console.log(typeofa);//function vara=3; functiona(){}; console.log(typeofa);//number }
测试12:(arguments对象)
test12(); functiontest12(){ functionfoo(a){ console.log(a);//1 arguments[0]=2; console.log(a);//2 console.log(arguments.length);//3 } foo(1,3,4); }
测试13:(中间函数名,直接使用会报错)
test13(); functiontest13(){ varfoo=functionbar(name){ console.log("hello"+name); } foo("world"); console.log(bar);//此处会报错barisnotdefined }
测试14:(在js中定时器,最后执行,涉及到的知识点是事件循环和事件队列)
test14(); functiontest14(){ functionfoo(){ console.log('Iamfoo'); } console.log('正常执行'); setTimeout((function(){ console.log('定时器大灰狼来啦'); }),0); foo(); }
感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.jb51.net/code/HtmlJsRun测试上述代码运行效果。
更多关于JavaScript相关内容可查看本站专题:《JavaScript操作DOM技巧总结》、《JavaScript页面元素操作技巧总结》、《JavaScript事件相关操作与技巧大全》、《JavaScript查找算法技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript错误与调试技巧总结》
希望本文所述对大家JavaScript程序设计有所帮助。