JavaScript学习日记1

1. document.write覆盖

<script>
function myfunction(){
    document.write("使用函数来执行doucment.write，即在文档加载后再执行这个操作，会实现文档覆盖");
}
document.write("<h1>这是一个标题</h1>");
document.write("<p>这是一个段落。</p>");
</script>
<p >
您只能在 HTML 输出流中使用 <strong>document.write</strong>。
如果您在文档已加载后使用它（比如在函数中），会覆盖整个文档。
</p>
<button type="button" "myfunction()">点击这里</button>

解决：

document.open("text/html","replace");
//中间输出
document.close()

2. let关键字

let允许你声明一个作用域被限制在块级中的变量、语句或者表达式。在Function中局部变量推荐使用let变量，避免变量名冲突。

function varTest() {
    var x = 1;
    if (true) {
        var x = 2;       // 同样的变量!
        console.log(x);  // 2
    }
    console.log(x);  // 2
}

function letTest() {
    let x = 1;
    if (true) {
        let x = 2;       // 不同的变量    
        console.log(x);  // 2  
    }
    console.log(x);  // 1
}

3. 数组定义

var arr1 = new Array('a', 'b', 'c');    //这是一个预定义的数组，在创建时初始化
var arr2 = ['a', 'b', 'c' ];       //同样是在创建时初始化，但是这种创建更为简洁直观
var arr3 = new Array( );   var arr4 = [ ];     //这两种是创建空的数组

4. 全选和取消全选

//html
看书：<input type="checkbox" name="checkbox" value=1><br>
写字：<input type="checkbox" name="checkbox"value=2><br>
打飞机：<input type="checkbox" name="checkbox"value=3><br>
玩游戏：<input type="checkbox" name="checkbox"value=4><br>
<button "checkboxed('checkbox')">全选</button>
<button "uncheckboxed('checkbox')">取消全选</button>

//js
function checkboxed(objName){
	var objNameList=document.getElementsByName(objName);	

	if(null!=objNameList){
		alert("全选操作");
		for(var i=0;i<objNameList.length;i++){
			objNameList[i].checked="checked";
		}
	}
}

function uncheckboxed(objName){
	var objNameList=document.getElementsByName(objName);	

	if(null!=objNameList){
		alert("取消全选操作");
		for(var i=0;i<objNameList.length;i++){
			objNameList[i].checked="";
		}
	}
}



//一个按钮搞定
//html
看书：<input type="checkbox" name="checkbox" value=1><br>
写字：<input type="checkbox" name="checkbox"value=2><br>
打飞机：<input type="checkbox" name="checkbox"value=3><br>
玩游戏：<input type="checkbox" name="checkbox"value=4><br>
<button "allcheck()">全选/取消</button>

//js
var checkAll = false;
function allcheck(){
    let inputs = document.getElementsByName('checkbox')
    for(var i =0;i<inputs.length;i++){
        for (var j = 0; j < inputs.length; j++) {
        //判断是否已经全选
            if (inputs[j].checked == true) {
                checkAll = false;
            }else{
                checkAll = true;
                continue;
            }
        }
        inputs[i].checked = checkAll;
    }
}

4. 函数内未声明即使用的变量情况：

function func(){
  undefined_var=110
}

在 func() 被第一次调用之前，undefined_var 变量是不存在的即 undefined。func()被调用过之后，undefined_var 成为全局变量。

5. 不要创建 String 对象。它会拖慢执行速度，并可能产生其他副作用.

6. java同款

var result1=5+5+"abc"; //结果将是"10abc"

var result2= ""+5+5+"abc"; //结果将是"55abc"

7. 常见的不同类型运算的转换方式：

• 字符串和数字相加，数字转成字符串.

var one="This is a test";
var two=123;
var three=one+two;
// 结果：three:This is a test123

• 数字和布尔值相加，布尔值 false 转成 0，true 转成 1

var one=13;
var two=true;
var three=one+two;
// 结果 three:14

• 字符串与布尔值相加，布尔值转化成字符串。

8. 取模运算的结果符号只与左边值的符号有关：

var x = 7 % 3; // 结果为 1
var y = 7 % (-3); // 结果为 1
var z = (-7) % 3; // 结果为 -1

9. 数字与 null(空值) 相加，null 转化为数字 0：
   var car=null+3+4; // 结果为7
   字符串与 null(空值) 相加，null 转化为字符串：
   var car=null+"a"; // 结果为 nulla

10. switch 中 case的判断是===的判断，即数据类型和值的双重判断，这点要注意。
    另外switch的判断条件可以是String 、Number、Boolean、char、枚举、null、undefined

11. 定义了数组后对数组进行赋值，中间如有某些下标未被使用（即未被赋值），在遍历的时候，采用一般的 for 循环和 for…in 循环得到的结果不同。
    for…in 循环会自动跳过那些没被赋值的元素，而 for 循环则不会，它会显示出 undefined。
    点击下面的按钮，循环遍历

<button "myFunction()">点击这里</button>
<p id="demo"></p>
<script>
function myFunction(){
    var array = new Array();
    var x;
    var txt=""
    array[0] = 1;
    array[3] = 2;
    array[4] = 3;
    array[10] = 4;
    for( x in array ){
        alert(array[x]);     // 依次显示出 1 2 3 4
    } 
    alert(array.length);    // 结果是11
    for( var i=0 ; i<4 ; i++){
        alert(array[i]);     // 依次显示出 1 undefined undefined 2 
    }
    document.getElementById("demo").innerHTML = txt;
}
</script>

12. break 的作用:跳出代码块

outerloop:
for (var i = 0; i < 10; i++)
{
    innerloop:
    for (var j = 0; j < 10; j++)
    {
        if (j > 3)
        {
            break;
        }
        if (i == 2)
        {
            break innerloop;
        }
        if (i == 4)
        {
            break outerloop;
        }
        document.write("i=" + i + " j=" + j + "");
    }
}