JS学习笔记01

2018 / 5 / 3

 

Js数据类型：Undefined 、 Null 、 Boolean 、 Number 、String、Object

使用typeof：Undefined、Object、 Boolean 、 Number 、String、Object

NaN => not aNumber 用isNaN() 判断

Js函数没有重载，其参数传递为数组，可通过argument来访问，修改数组的值会影响对应参数的值

 

Js函数的参数只能按值传递

Js 函数中可使用   arguements数组  来获取传入参数

A   Instanceof   B：A是否为B（A、B为Object）

-------------------------------------

2018 / 5 / 4

 

引用类型

1.Object

创建方法：（1）var Person = new Object(  );

                                 Person.name = ‘jack’;

                                 Person.age =15;   

                      （2）person={

                                          name :‘jack’,

                  age:15;

                       }

2.Array

创建方法：（1）var colors = new Array( );

                                 var colors =new Array("red", "blue", "green");              

                                 var colors =new Array(3); // 创建一个包含 3 项的数组

                                 var names = newArray("Greg"); // 创建一个包含 1 项，即字符串"Greg"的数组                            

                      （2）var colors = ["red","blue", "green"]; // 创建一个包含 3 个字符串的数组

                                 var names = [];// 创建一个空数组

 

-------------------------------------

2018 / 5 / 11

 

1.数组常用方法：

1.连接concat（）;

例子： var a=[1,2,3];   var b=[‘a’,’b’,’c’];  var c=a.concat(b);

C为[1,2,3, ‘a’,’b’,’c’]

2.插入

push();从数组末尾插入

unshift();从数组前面插入

3.删除

pop();从数组末尾删除

shift();从数组前面删除

4.删除/替换/插入

splice( 要操作的数组下标，删除个数，要插入的元素1，要插入的元素2，……)

（1）从下标m开始（包括该下标）删除n个元素(n=1时删除下标为m的元素)

splice(m,n);

  （2）从下标m开始插入n个元素

splice(m,0,元素1,……);

（3）替换下标为m的元素

                   splice(m,1,元素1,……);

5. 排序sort()

默认为按字符排序，

可传入判断函数

function(a,b){

               a在b前返回  负数

               a在b后返回  正数

               相等返回       0

}

6.  join（）方法

将数组变为字符串  例如：var a=[‘a’,’b’,’c’]   a.join(‘-’)   得到=> ‘a-b-c’

7.lenght属性

数组长度，可设置，设置为0时则清空数组

 

-----------------------------------------------------------------------------------------------------------------------------

2.Json;

var  person ={

                        key:values

                        ‘name’:jim,

                        ‘age’:16

}

for( key inperson){   //遍历json对象

                        person[key];

}

-----------------------------------------------------------------------------------------------------------------------------

3.获取外部样式

通过getComputedStyle和currentStyle来获取样式

（1）getComputedStyle的使用环境是chrome/safari/firefox IE 9,10,11

<script>

  vardiv =document.getElementsByTagName("div")[0];

  varstyleObj = window.getComputedStyle(div,null);

  console.log(styleObj.backgroundColor);//red

  console.log(styleObj.color);//yellow

</script>

（2）currentStyle在IE里能得到完美支持，chrome不支持，ff不支持

<script>

    vardiv =document.getElementsByTagName("div")[0];

    varstyleObj = div.currentStyle;

    console.log(styleObj.backgroundColor);//red

    console.log(styleObj.color);//yellow

</script>

兼容问题通过if()判断后来确定执行的代码；

例如：if(obj. currentStyle){  

                        currentStyle代码体……

               }else{

                        getComputedStyle代码体……

               }

-------------------------------------

2018 / 5 / 12

计时器(可用于无缝滚动)

开启：var timer = setInterval(函数，间隔时间)；

关闭：clearInterval（timer）;

开启单次：var timer =setTimeout(函数，间隔时间);

关闭单次：clearTimeout (timer );

 

无缝滚动：注意设置位置权限：

relative相对于本身移动（放在外层与absolute<内层>连用）

absolute相对于上一个可定位的元素移动

offsetLeft  获取计算后的左边距

offsetWidth获取元素宽度

例子：

functionmove(){

                                     if(oUl.offsetLeft<-oUl.offsetWidth/2){//左滚动判断

                                               oUl.style.left= 0;

                                     }

                                     if(oUl.offsetLeft>0){//右滚动判断

                                               oUl.style.left= -oUl.offsetWidth/2;+'px'

                                     }

                                     oUl.style.left= oUl.offsetLeft+speed+'px';

                            }

-------------------------------------