@fantaghiro 2014-12-23T09:04:32.000000Z 字数 2293 阅读 1684

妙味课堂-真的了解JS吗

学习笔记 js 前端 妙味课堂

定时器

//定时器的三个参数：第一个是函数；第二个时间（毫秒）；第三个是函数的回调参数
setTimeout(function(num){
    alert(num);
}, 1000, 123)

拼接字符串

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>真的了解JS吗</title>
    <script>
    window.onload = function(){
        /*document.body.innerHTML = 
            '<div>div</div>' + 
            '<span>span</span>' +
            '<p>p</p>' +
            '5555';*/
        //通过反斜杠，完成字符串换行拼接
        document.body.innerHTML = 
            '<div>div</div>\
            <span>span</span>\
            <p>p</p>\
            5555';
    }
    </script>
</head>
<body>
</body>
</html>

console.log

var a = 'hello';
console.log(a);
//添加样式
console.log('%c'+a, 'font-size:400%; background: blue; color: white;')

typeof

//typeof instanceof in 除了空格以外，还可以用小括号的形式
var arr = [];
arr.num = 10;
//alert(typeof arr);
//alert(typeof(arr));
//instanceof
//alert(arr instanceof Object);
//alert(arr instanceof(Object));
//in
//alert('num' in arr);
alert('num' in(arr));

嵌套for循环

/*for(var i=0; i<5; i++){
    for(var j=0; j<1; j++){
        if(i == 3){
            break; //break只跳出当前循环
        }
        alert(i); //弹出0, 1, 2, 4
    }
}*/
a : for(var i=0; i<5; i++){
    for(var j=0; j<1; j++){
        if(i == 3){
            break a; //给循环起个名字，在break后面加上这个名字，就能跳出这个循环
        }
        alert(i); //弹出0, 1, 2
    }
}

for(;;)

/*for(var i=0; i<5; i++){
    alert(i);
}*/
/*var i = 0;
for(; i<5; i++){
    alert(i);
}*/
var i=0;
for(;;){
    alert(i);
    if(++i >= 5){
        break;
    }
}

call

var obj = {
    aaa : function(){
        alert(this);
    }
};
var arr = [1,2,3];
obj.aaa.call(arr); //1, 2, 3
obj.aaa.call(window); //window
obj.aaa.call(); //call里面什么也不写，默认是window
//apply()也是一样，当不写参数的时候，也是指向window

insertBefore

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>真的了解JS吗</title>
    <script>
    window.onload = function(){
        var oInput = document.getElementById('input1');
        var oUl = document.getElementById('ul1');
        var iNow = 0;
        var aLi = oUl.getElementsByTagName('li');
        oInput.onclick = function(){
            var oLi = document.createElement('li');
            oLi.innerHTML = iNow++;
            // oUl.appendChild(oLi);
            /*if(!aLi.length){
                oUl.appendChild(oLi);
            } else {
                oUl.insertBefore(oLi, aLi[0]);
            }*/
            oUl.insertBefore(oLi, aLi[0]);
            //insertBefore如果第二个参数为空的话，其实效果与appendChild是一样的
        }
    }
    </script>
</head>
<body>
<input type="button" value="添加" id="input1">
<ul id="ul1"></ul>
</body>
</html>

匿名函数自执行

/*(function(){
    alert(123);
})(); //匿名函数自执行*/
!function(){ //如果不把function括起来，在function前面添加位运算符（如~或!）也可以起到同样效果
    alert(123);
}()
~function(){ //如果不把function括起来，在function前面添加位运算符（如~或!）也可以起到同样效果
    alert(123);
}()
+function(){ //如果不把function括起来，在function前面添加位运算符（如~或!）也可以起到同样效果
    alert(123);
}()

创建对象

function Aaa(){
}
//var a1 = new Aaa();
var a1 = new Aaa; //在js中，创建对象时是可以省略这个小括号的，系统对象也是如此
alert(a1);
var arr = new Array;
alert(arr.length);

妙味课堂-真的了解JS吗

定时器

拼接字符串

console.log

typeof

嵌套for循环

for(;;)

call

insertBefore

匿名函数自执行

创建对象

内容目录