详细谈谈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 相关文章推荐
编写Js代码要注意的几条规则
Sep 10 Javascript
javascript中万恶的function实例分析
May 25 Javascript
IE6/7 and IE8/9/10(IE7模式)依次隐藏具有absolute或relative的父元素和子元素后再显示父元素
Jul 31 Javascript
jQuery图片预加载 等比缩放实现代码
Oct 04 Javascript
使用js声明数组,对象在jsp页面中(获得ajax得到json数据)
Nov 05 Javascript
jQuery遍历之next()、nextAll()方法使用实例
Nov 08 Javascript
jQuery实现的fixedMenu下拉菜单效果代码
Aug 24 Javascript
js获取元素的外链样式的简单实现方法
Jun 06 Javascript
巧用canvas
Jan 21 Javascript
js弹性势能动画之抛物线运动实例详解
Jul 27 Javascript
vue组件之间的数据传递方法详解
Apr 19 Javascript
vue.js实现三级菜单效果
Oct 19 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
dede3.1分页文字采集过滤规则详说(图文教程)续四
2007/04/03 PHP
php 升级到 5.3+ 后出现的一些错误,如 ereg(); ereg_replace(); 函数报错
2015/12/07 PHP
php开发时容易忘记的一些技术细节
2016/02/03 PHP
php用户密码加密算法分析【Discuz加密算法】
2016/10/12 PHP
Laravel框架模型的创建及模型对数据操作示例
2019/05/07 PHP
HR vs ForZe BO3 第一场 2.13
2021/03/10 DOTA
EXTJS记事本 当CompositeField遇上RowEditor
2011/07/31 Javascript
利用json获取字符出现次数的代码
2012/03/22 Javascript
javascript实现yield的方法
2013/11/06 Javascript
使用jquery+CSS实现控制打印样式
2014/12/31 Javascript
js的toLowerCase方法用法实例
2015/01/27 Javascript
纯js模拟div层弹性运动的方法
2015/07/27 Javascript
Web前端开发工具——bower依赖包管理工具
2016/03/29 Javascript
Jquery中map函数的用法
2016/06/03 Javascript
jquery datatable服务端分页
2016/08/31 Javascript
VueJs组件之父子通讯的方式
2018/05/06 Javascript
详解javascript中的Error对象
2019/04/25 Javascript
javascript实现放大镜功能
2020/12/09 Javascript
使用python统计文件行数示例分享
2014/02/21 Python
决策树的python实现方法
2014/11/18 Python
Python 实现购物商城,含有用户入口和商家入口的示例
2017/09/15 Python
python矩阵的转置和逆转实例
2018/12/12 Python
python+django+rest框架配置创建方法
2019/08/31 Python
pymysql模块的使用(增删改查)详解
2019/09/09 Python
Python爬虫实现的根据分类爬取豆瓣电影信息功能示例
2019/09/15 Python
医学毕业生自荐信
2013/10/11 职场文书
菜篮子工程实施方案
2014/03/08 职场文书
优秀中职教师事迹材料
2014/08/26 职场文书
简易离婚协议书范本2014
2014/10/15 职场文书
简单的辞职信范文(2016最新版)
2015/05/12 职场文书
河童之夏观后感
2015/06/11 职场文书
小学三年级班主任工作经验交流材料
2015/11/02 职场文书
《月球之谜》教学反思
2016/02/20 职场文书
详解RedisTemplate下Redis分布式锁引发的系列问题
2021/04/27 Redis
PHP使用QR Code生成二维码实例
2021/07/07 PHP
GoFrame框架数据校验之校验结果Error接口对象
2022/06/21 Golang