详细谈谈javascript的对象


Posted in Javascript onJuly 31, 2016

javascript中有很多对象内容,挑几个感觉用的比较多的讲解。

在网上学习一些和看javascript的学习手册。

详细谈谈javascript的对象

如果要这个手册的可以留言,看到了我就发给你。恩,接下来总结一下我自己对象进阶之路。

1.对象: 

  (1)javascript中的所有事件都是对象:字符串、数组、函数.....

  (2)每个对象带有属性和方法。

  (3)JS允许自定义对象。

2.自定义对象 :

 (1)定义并创建对象实例。

 (2)使用函数来定义对象,然后创建新的对象实例。

例(针对2-(1)):

方法1:

           <script>

                     people=new Object();

                     people.name="颜小媛";

                     people.age="18";

                     document.write("name:"+people.name+",age:"+people.age);

           </script>

   结果:界面打印出name:颜小媛,age:18

方法2:

          <script>

                people=new Object();

                people={

                      name:"颜小媛",

                      age:18

                   }

                document.write("name:"+people.name+",age:"+people.age);

          </script>

  结果:界面打印出name:颜小媛,age:18

例(针对2-(2)):

      <script>

             function people(name,age){

                         this.name=name;

                         this.age=age;

              }

           son=new people("颜小媛",18);

           document.write("name:"+son.name+",age:"+son.age);

      </script>

      结果:界面打印出name:颜小媛,age:18

string字符串对象

1.string对象:

           string对象用于处理已有的字符串;字符串可以使用单引号或双引号【扩:混合使用避免冲突。】。

2.一些属性的演示:

   (1)在字符串中查找字符串:indexOf()

例(针对2-(1)):

    <script>

             var str="hello world";

             document.write("字符串:"+str.length+"<br/>");

             document.write(“world的位置:”+str.indexOf("world")+"<br/>");

             document.write(“llllll的位置”str.indexOf("llllll"));

    </script>

  结果:界面打印出字符串:11

                    world的位置:6

                    lllllll的位置:-1

    (2)内容匹配:match()

例(针对2-(2)):

    <script>

              var str="hello world";

              document.write(str.match("world"));

              document.write(str.match("lllllll"));

   </script>

结果:界面打印出 world null

(3)替换内容:replace()

例(针对2-(3)):

         <script>

                 var str="hello world";

                 document.write(str.replace("world","123"));

         </script>

结果:界面打印出hello 123

(4)字符串大写转换:toUpperCase() / toLowerCase()

例(针对2-(4)):

         <script>

                 var str="hello world";

                 document.write(str.toUpperCase());

         </script>

   结果:界面打印出HELLO WORLD

(5)字符串转为数组:split()

例(针对2-(5)):

   <script>

               var str1="hello,jjj,lll,kkk";

               var s=str1.split(",");//以逗号作为分隔符

               document.write(s[1]);

  </script>

结果:界面打印jjj

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

Date日期对象

1.Date对象:

        日期对象用于处理日期和时间。

2.获得当日的日期。

3.一些常用的方法:

   (1)getFullYear():获取年份。

   (2)getTime():获取毫秒。

   (3)setFullYear():设置具体的日期。

   (4)getDay():获取星期。

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

例(针对3):

    <script>

              var date = new  Date();

              document.write(date+"<br/>");

              document.write(date.getFullYear()+"<br/>");

              document.write(date.getTime()+"<br/>");

              document.write(date.getDay()+"<br/>");

              date.setFullYear(2010,1,1);

              document.write(date);

   </script>

结果:

详细谈谈javascript的对象

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

4.时钟实例:

<html>
     <head>
                   <script >
                               function startTime(){    
                                               var today=new Date();
                                               var h=today.getHours();
                                               var m=today.getMinutes();
                                               var s=today.getSeconds();
                                               m=checkTime(m);
                                               s=checkTime(s);
                                               document.getElementById('txt').innerHTML=h+":"+m+":"+s;
                                               t=setTimeout('startTime()',500);//等同于t=setTimeout(function(){starTime;},500)
                               }

                             function checkTime(i)  {
                                              if (i<10) {

                                                    i="0" + i;

                                              }
                                                      return i
                                      }
                   </script>
           </head>

           <body onload="startTime()">
                   <div id="txt"></div>
            </body>
</html>

结果:动态的显示时间

详细谈谈javascript的对象

Array对象:

1.Array对象:

        使用单独的变量来存储一系列的值。

2.数组的创建:

例:var myArray=["kkk","ddd","ddddd"];

3.数组的访问:

       通过指定数组名以及索引号码,你可以访问某个特定的元素。

【注意:[0]是数组第一个元素,以此类推。】

4.数组常用的方法:

(1)concat():合并数组。

(2)sort():排序。

(3)push():末尾追加元素。

(4)reverse():数组元素翻转。

例(针对4-(1)):

   <script>

              var a=["aa","bb"];

              var b=["cc","dd"];

              var c=a.concat(b);

              document.write(c);

  </script>

结果:界面打印出 aa bb cc dd

例(针对4-(2)):

    <script>

           var a=["a","c","d","t","b","e"];

           document.write(a.sort());

   </script>

结果:界面打印出a b c e d t

【扩展】

      <script>

              var a=["5","2","3","4","1"];

              document.write(a.sort(function(a,b){return b-a;}))

     </script>

结果:界面打印出54321.(ps:因为b-a是倒序排列)。

例(针对4-(3)):

   <script>

          var a=["a","b"];

          a.push(c);

          document.write(a); 

  </script>

结果:打印出abc

例(针对4-(4)):

   <script>

          var a=["c","b","a"];

          document.write(a.reverse());

   </script>

结果:打印出abc

Math对象:

1.Match对象:

           执行常见的算数任务。

2.常见方法:

(1)round():四舍五入。

(2)random():返回0~1之间的随机数。

(3)max():返回最高值。

(4)min():返回最小值。

(5)abs():返回绝对值。

例(针对2-(1)):

  document.write(Math.round(2.5));

结果:界面打印出3

例(针对2-(2)):

document.write(Math.randow());

结果:界面随机打印出0~1的一个数。

document.write(Math.randow()*10);

结果:界面随机打印出1~10的一个数。

document.write(parseInt(Math.randow()));

结果:界面随机打印出0~1的一个数,并且这个数是整数。

例(针对2-(3)):

document.write(Math.max(10,20,3,90));

结果:界面打印出最大值90.

例(针对2-(4)):

document.write(Math.min(12,0,2,3,4));

结果:界面打印出最小值0.

例(针对2-(5)):

document.write(Math.abs(-10));

结果:界面打印出10.

Javascript 相关文章推荐
google 搜索框添加关键字实现代码
Apr 24 Javascript
js 返回时间戳所对应的具体时间
Jul 20 Javascript
mailto的使用技巧分享
Dec 21 Javascript
JQuery 控制内容长度超出规定长度显示省略号
May 23 Javascript
JS拖动鼠标画出方框实现鼠标选区的方法
Aug 05 Javascript
JavaScript Split()方法
Dec 18 Javascript
jquery zTree异步加载简单实例讲解
Feb 25 Javascript
AngularJS 整理一些优化的小技巧
Aug 18 Javascript
详解Angular.js的$q.defer()服务异步处理
Nov 06 Javascript
vue.js实现含搜索的多种复选框(附源码)
Mar 23 Javascript
使用socket.io制做简易WEB聊天室
Jan 02 Javascript
动态加载权限管理模块中的Vue组件
Jan 16 Javascript
JS中使用DOM来控制HTML元素
Jul 31 #Javascript
图解prototype、proto和constructor的三角关系
Jul 31 #Javascript
JavaScript数据类型转换的注意事项
Jul 31 #Javascript
关于JavaScript 原型链的一点个人理解
Jul 31 #Javascript
jquery实现界面无刷新加载登陆注册
Jul 30 #Javascript
AngularJS ng-change 指令的详解及简单实例
Jul 30 #Javascript
Javascript中级语法快速入手
Jul 30 #Javascript
You might like
php结合飞信 免费天气预报短信
2009/05/07 PHP
基于Snoopy的PHP近似完美获取网站编码的代码
2011/10/23 PHP
ThinkPHP框架搭建及常见问题(XAMPP安装失败、Apache/MySQL启动失败)
2016/04/15 PHP
一个仿糯米弹框效果demo
2014/07/22 Javascript
jsMind通过鼠标拖拽的方式调整节点位置
2015/04/13 Javascript
Jquery uploadify上传插件使用详解
2016/01/13 Javascript
vue实现动态数据绑定
2017/04/28 Javascript
Javascript中的getter和setter初识
2017/08/17 Javascript
WebGL学习教程之Three.js学习笔记(第一篇)
2019/04/25 Javascript
微信小程序实现Session功能及无法获取session问题的解决方法
2019/05/07 Javascript
基于vue写一个全局Message组件的实现
2019/08/15 Javascript
原生js拖拽实现图形伸缩效果
2020/02/10 Javascript
[05:05]DOTA2亚洲邀请赛 战队出场仪式
2015/02/07 DOTA
Python yield 小结和实例
2014/04/25 Python
Python 3中的yield from语法详解
2017/01/18 Python
Golang与python线程详解及简单实例
2017/04/27 Python
python实现简单的文字识别
2018/11/27 Python
python3 map函数和filter函数详解
2019/08/26 Python
python实现银行账户系统
2021/02/22 Python
美国乡村商店:Plow & Hearth
2016/09/12 全球购物
西班牙灯具网上商店:Lampara.es
2018/06/05 全球购物
乌克兰电子和家用电器商店:Foxtrot
2019/07/23 全球购物
简述安装Slackware Linux系统的过程
2012/05/08 面试题
写自荐信的七个技巧
2013/10/15 职场文书
毕业生就业自荐书
2013/12/15 职场文书
兰兰过桥教学反思
2014/02/08 职场文书
一年级学生期末评语
2014/04/21 职场文书
2014年少先队工作总结
2014/12/03 职场文书
2014年煤矿安全工作总结
2014/12/04 职场文书
公司给客户的感谢信
2015/01/23 职场文书
升学宴家长答谢词
2015/09/29 职场文书
2016秋季运动会开幕词
2016/03/04 职场文书
python 实现mysql自动增删分区的方法
2021/04/01 Python
pytorch中的numel函数用法说明
2021/05/13 Python
利用Pycharm连接服务器的全过程记录
2021/07/01 Python
Flink 侧流输出源码示例解析
2022/09/23 Servers