day01

A.今天你学到了什么

1.注释的分类用法

//单行注释
/* */多行注释

2.标识符

变量，函数，属性的名字或者函数的参数
命名规则：
a.  由字母,数字，下划线，美元符号，组成
b.  不能以数字开头
c.  不能使用关键字，保留字

3.变量

3.1 'javascript'的变量是松散类型。可以储存任何类型的数据
3.2  使用'var'关键字进行声明
3.3 变量可以先声明再赋值，也可以在声明的同时赋值
var a;
a=10;  //或者
var a=10;

4.数据类型

4.1 原始类型

4.1.1 number类型

var a=10;  var a =10.14;

4.1.2 string类型

用单引号或者双引号包裹
var a="hello world";
var b='good';

4.1.3 boolean类型

只有两个值，true false
var a=true;
var b=false;

4.1.4 undefined类型

var a;   一个变量未赋值就是undefined

4.1.5 null类型

1. null 表示一个空对象
2.如果定义一个变量准备保存一个对象，最好将变量初始化为null,而不是其他值

4.2 引用数据类型

包括：array，object，function

4.2.1 array数组

1.声明变量
var arr=[1,3,5];
2.获取数组长度
arr.lenght
3.读取数组的某一个值，通过数组的下标，下标从0开始
arr[index];
4.向数组的末尾添加值,jS中可以直接添加
arr[arr.lenght]=5;

4.2.2 object 对象

1.声明一个对象
var obj={
      name:"libai";
      agr:20;
}
2.获取变量的属性
console.log(obj.name);

4.2.3 function

定义：封装特点功能的代码块

1.声明函数
function  say(){
    console.log("i kan say");
}
2.调用函数
say();

5. 声明提前

在正式执行脚本前，先将所有var声明的变量，提前预读到当前作用域
顶部，集中声明创建。然后在执行程序。
赋值留在本地
eg：
console.log(a);//undefined
var a=10;

6.typeof

获得变量的数据类型

var a =10;
console.log(typeof a);  //number
var arr=[2,3];
console.log(typeof arr);  //true

7.全局变量与局部变量

全局变量： 在函数外声明的变量
局部变量：在函数内部声明的变量

8.数据类型的转换

8.1 强制转换

1.任意转换为number：number();
其中number(true); //1
number(false);  //0
2.Number 只能识别数字类型的字符串
str  a="20px";
parseInt(a);  //20;
Number(a);  //NaN
3.任意转换为字符串
x.toString();x不为undefied或者null时，才可用
String (x);
4.任意值换换为boolean
只有五个值转为false;
""  NaN undefined null 0
其余都转为true；

8.2自动转换

// 算术计算中的自动转换+ - * / % 
        //   先转换为Number（）,再计算
        var a=10;
        var b=true;
        var c=a-b; //9
        var d ="hello";
// 当算术符号为“+” 时，加入一方为字符串时，则直接字符串重组。
      var e=a+d; //10hello

9.运算符合表达式

1.算术运算符
+ - * / % ++  --
2.比较运算符,返回值为true，false
< ,>,<=,>=,==,!=
3.逻辑运算 将多个关系式运算结合起来，返回true，false
&& ||  !
4.赋值运算
+=   -= *=  /=  %=
5.三目运算
var  a=(10>4)?10:4;

10.递增和递减

1.递增
++a ;++a 
1.1单独运算，都会自增1
1.2在表达式中使用
++a ;  a 先自增在运算
a++;   a 先运算在自增

11.数组的遍历和获取对象值

var arr =[2,3,5,7];
        for(var i=0;i<arr.length;i++){
            console.log(arr[i]);
        }
        for(var key in arr){
            console.log(arr[key]);
        }
        var obj={
            name:"chengchao",
            age:19
        }
        for(var k in obj){
            console.log(obj[k])
        }

12.作用域

//es6版本之前没有块级作用域
        for(var i=0;i<5;i++){
            console.log("hello world");  //5 hello world
        }
        console.log(i);  // 5
        //es 6版本 有块级作用域
       for(let i;i<5;i++){
           console.log('let');
       }{
           let a=10;
       }
       console.log(a); //报错

13.continue和break用法

  for(let i=0;i<5;i++){
            if(i==3){
                continue;
            }
        console.log(i); //0 1 2 4
        }
 for(let i=0;i<5;i++){
            if(i==3){
                break;
            }
        console.log(i); //0 1 2
        }

14.使用id获取一个元素，并更改元素内容

         // 如何获取一个节点 id获取
        var test=document.getElementById("test");
        console.log(test);
        // 2.修改元素的内容
        test.innerHTML="change";

15.通过标签名获取 -获取一个集合

        var p = document.getElementsByTagName("p");
        // p[0].innerHTML = "change";
        var btn = document.getElementById("btn");
        btn.onclick = function(){
            for(let i=0;i<p.length;i++){
                p[i].innerHTML = "change"
            }
        }

16.通过class选择器获取元素

 <!-- p.one{hello world}*4        -->
    <p class="one">hello world</p>
    <p class="one">hello world</p>
    <p class="one">hello world</p>
    <p class="one">hello world</p>
    <script>
        var ps = document.getElementsByClassName("one");
        console.log(ps);
    </script>

17.获得全部的元素

    <div class="one">hello world</div>
    <div class="one">hello world</div>
    <div class="one">hello world</div>
    <script>
        var one  = document.querySelectorAll(".one");
        console.log(one);
     </script>