js 归档 - 爱前端

前端

相册特效-旋转木马

地址：http://www.bestcyt.com/sourceCode/Album_special_effects_01/ 源码下载演示gif：

2020年2月2日 151

JavaScript效果Demo在线演示下载

Demo 源码下载 ajax前后数据交互点击演示 canvas 小球移动可开始停止点击演示 ECharts App实时图表demo 点击演示 JS制作放大镜demo 点击演示 …

前端 2019年5月14日 613

数组常用的API总结

<script>
    //数组api不需要单独创建，只要声明了数组，该数组自动拥有所有的API
    var arr = [100,60,88,95,20];
    //1.连接两个数组：参数：要连接的数组
    console.log ( arr.concat ([30,40,80]) );
    //2.将数组的元素拼接成字符串
    //作用：将数组的每一个元素拼接成一个字符串
    //参数：元素之间的分隔符
    console.log ( arr.join ('') );
    //3.删除数组最后一个元素
    console.log ( arr.pop () );//返回值：删除的那个元素
    console.log ( arr );//[100, 60, 88, 95]
    //等价于：arr.length--
    //4.往数组后面加元素
    console.log ( arr.push ( 80 ) );//返回值：新数组的长度
    console.log ( arr );//[100, 60, 88, 95, 80]
    //等价于：arr[arr.length] = 80;
    //5.翻转数组
    console.log ( arr.reverse () );
    //6.删除数组第一个元素
    console.log ( arr.shift () );//删除的第一个元素
    console.log ( arr );
    //7.查询数组元素
    var arr = [100,20,30,40,50,60,70];
    //arr.slice(start,end)      start <=  范围   < end
    console.log ( arr.slice ( 2, 5 ) );//[30,40,50]
    //8.数组排序
    /*sort排序方法参数是一个固定的函数(回调函数)
    从小到大：  function (a, b) {
        return a-b;
    }
    从大到小： function (a, b) {
        return ;
    }
     */
    console.log ( arr.sort (function (a, b) {
        return b-a;
    }) );
</script>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

//数组api不需要单独创建，只要声明了数组，该数组自动拥有所有的API

var arr = [100,60,88,95,20];

//1.连接两个数组：参数：要连接的数组

console.log ( arr.concat ([30,40,80]) );

//2.将数组的元素拼接成字符串

//作用：将数组的每一个元素拼接成一个字符串

//参数：元素之间的分隔符

console.log ( arr.join ('') );

//3.删除数组最后一个元素

console.log ( arr.pop () );//返回值：删除的那个元素

console.log ( arr );//[100, 60, 88, 95]

//等价于：arr.length--

//4.往数组后面加元素

console.log ( arr.push ( 80 ) );//返回值：新数组的长度

console.log ( arr );//[100, 60, 88, 95, 80]

//等价于：arr[arr.length] = 80;

//5.翻转数组

console.log ( arr.reverse () );

//6.删除数组第一个元素

console.log ( arr.shift () );//删除的第一个元素

console.log ( arr );

//7.查询数组元素

var arr = [100,20,30,40,50,60,70];

//arr.slice(start,end) start <= 范围 < end

console.log ( arr.slice ( 2, 5 ) );//[30,40,50]

//8.数组排序

/*sort排序方法参数是一个固定的函数(回调函数)

从小到大： function (a, b) {

return a-b;

}

从大到小： function (a, b) {

return ;

}

*/

console.log ( arr.sort (function (a, b) {

return b-a;

}) );

</script>

笔记 2018年5月9日 158

Data对象API

<script>
    /*
        Date对象：获取当前日期时间
     */
    var myDate= new Date();
    console.log ( myDate );//日期对象在打印的时候会自动转成事件字符串
    //1.转换格式
    console.log ( myDate.toLocaleTimeString () );
    console.log ( myDate.toLocaleString () );//2018/9/1 下午4:25:29
    //2.常用：获取年月日时分秒
    console.log ( myDate.getFullYear () );//2018  年
    //月份范围： 0-11  对应  1 - 12
    console.log ( myDate.getMonth () );//8（下标为8，第九个元素）   9月
    console.log ( myDate.getDate () );//1  日期
    //    星期 0-6     周日-周六
    console.log ( myDate.getDay () );//6  星期
    console.log ( myDate.getHours () );//16  时
    console.log ( myDate.getMinutes () );//30  分
    console.log ( myDate.getSeconds () );//11  秒
    console.log ( myDate.getMilliseconds () );//477  毫秒
    //3.创建自定义时间
    //3.1  参数分别对应：年月日时分秒
    var date1 = new Date(2017,1,5,10,30,10);//Sun Feb 05 2017 10:30:10 GMT+0800 (中国标准时间)
    console.log ( date1 );
    //3.2  参数传一个时间格式字符串  yyyy-mm-dd HH:mm:ss
    var date2 = new Date('2018-10-15 20:30:00');
    console.log ( date2 );
</script>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

/*

Date对象：获取当前日期时间

*/

var myDate= new Date();

console.log ( myDate );//日期对象在打印的时候会自动转成事件字符串

//1.转换格式

console.log ( myDate.toLocaleTimeString () );

console.log ( myDate.toLocaleString () );//2018/9/1 下午4:25:29

//2.常用：获取年月日时分秒

console.log ( myDate.getFullYear () );//2018 年

//月份范围： 0-11 对应 1 - 12

console.log ( myDate.getMonth () );//8（下标为8，第九个元素） 9月

console.log ( myDate.getDate () );//1 日期

// 星期 0-6 周日-周六

console.log ( myDate.getDay () );//6 星期

console.log ( myDate.getHours () );//16 时

console.log ( myDate.getMinutes () );//30 分

console.log ( myDate.getSeconds () );//11 秒

console.log ( myDate.getMilliseconds () );//477 毫秒

//3.创建自定义时间

//3.1 参数分别对应：年月日时分秒

var date1 = new Date(2017,1,5,10,30,10);//Sun Feb 05 2017 10:30:10 GMT+0800 (中国标准时间)

console.log ( date1 );

//3.2 参数传一个时间格式字符串 yyyy-mm-dd HH:mm:ss

var date2 = new Date('2018-10-15 20:30:00');

console.log ( date2 );

</script>

笔记 2018年5月9日 176

闭包小记

<script>
    //1.闭包.
    //就是声明在函数内部可以访问函数内部的局部变量的函数.
    //闭包就是能够读取其他函数内部变量的函数， 由于在 Javascript 语言中，只有函数内部的子函数才能读取局部变量， 因此可以把闭包简单理解成 “定义在一个函数内部的函数”。
    // function test1(){
    //   var num = 10;
    //   function test2(){
    //     console.log(num);
    //   }
    // }
    //-------------------------------
    //闭包: 在函数外部访问函数内部的局部变量.
     function test1(){
       var num = 10;
       function test2(){
         console.log(num);
       }
       return test2; //返回的是test2这个函数本身
     }
     //调用test1函数,就会得到一个返回值fn,这个fn本质就是test2函数.
     var fn =  test1();
     fn(); //在这里调用fn函数,实际上就是执行的test2的函数体.
    //--------------------------------------------
    // var fn = (function () {
    //   var num1= 10;
    //   function inner(){
    //     console.log(num1);
    //   }
    //   return inner;
    // }());
    // //此时这个fn就相当于是inner函数,调用fn就执行inner函数的函数体.
    // fn();
  </script>

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

//1.闭包.

//就是声明在函数内部可以访问函数内部的局部变量的函数.

//闭包就是能够读取其他函数内部变量的函数，由于在 Javascript 语言中，只有函数内部的子函数才能读取局部变量，因此可以把闭包简单理解成 “定义在一个函数内部的函数”。

// function test1(){

// var num = 10;

// function test2(){

// console.log(num);

// }

//-------------------------------

//闭包: 在函数外部访问函数内部的局部变量.

function test1(){

var num = 10;

function test2(){

console.log(num);

}

return test2; //返回的是test2这个函数本身

}

//调用test1函数,就会得到一个返回值fn,这个fn本质就是test2函数.

var fn = test1();

fn(); //在这里调用fn函数,实际上就是执行的test2的函数体.

//--------------------------------------------

// var fn = (function () {

// var num1= 10;

// function inner(){

// console.log(num1);

// }

// return inner;

// }());

// //此时这个fn就相当于是inner函数,调用fn就执行inner函数的函数体.

// fn();

</script>

笔记 2018年3月13日 134

js

相册特效-旋转木马

JavaScript效果Demo在线演示下载

数组常用的API总结

Data对象API

闭包小记

联系我们