详细谈谈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 相关文章推荐
JavaScript.Encode手动解码技巧
Jul 14 Javascript
JavaScript内核之基本概念
Oct 21 Javascript
封装html的select标签的js操作实例
Jul 02 Javascript
js克隆对象、数组的常用方法介绍
Sep 26 Javascript
jquery fancybox ie6不显示关闭按钮的解决办法
Dec 25 Javascript
node.js中的emitter.on方法使用说明
Dec 10 Javascript
基于jquery实现的树形菜单效果代码
Sep 06 Javascript
一起学写js Calender日历控件
Apr 14 Javascript
ajax 提交数据到后台jsp页面及页面跳转问题
Jan 19 Javascript
vue v-model动态生成详解
Jun 30 Javascript
vue页面加载时的进度条功能(实例代码)
Jan 13 Javascript
vue element ui validate 主动触发错误提示操作
Sep 21 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图片的裁剪与缩放生成符合需求的缩略图
2013/01/11 PHP
php导入导出excel实例
2013/10/25 PHP
Yii框架批量插入数据扩展类的简单实现方法
2017/05/23 PHP
Laravel向公共模板赋值方法总结
2019/06/25 PHP
php把文件设置为插件的技巧方法
2020/02/03 PHP
用js实现计算代码行数的简单方法附代码
2007/08/13 Javascript
为jQuery增加join方法的实现代码
2010/11/28 Javascript
重载toString实现JS HashMap分析
2011/03/13 Javascript
JavaScript高级程序设计 DOM学习笔记
2011/09/10 Javascript
jQuery插件支持同一页面被多次调用
2016/02/14 Javascript
fullCalendar中文API官方文档
2017/02/07 Javascript
Vue2路由动画效果的实现代码
2017/07/10 Javascript
jquery 实现拖动文件上传加载进度条功能
2018/03/18 jQuery
浅谈Vue.js 中的 v-on 事件指令的使用
2018/11/25 Javascript
vue权限问题的完美解决方案
2019/05/08 Javascript
Python中input和raw_input的一点区别
2014/10/21 Python
python通过pil模块将raw图片转换成png图片的方法
2015/03/16 Python
Python实现的使用telnet登陆聊天室实例
2015/06/17 Python
Python多线程爬虫简单示例
2016/03/04 Python
Python调用SQLPlus来操作和解析Oracle数据库的方法
2016/04/09 Python
Python实现进程同步和通信的方法
2018/01/02 Python
pandas中遍历dataframe的每一个元素的实现
2019/10/23 Python
Python中顺序表原理与实现方法详解
2019/12/03 Python
Python3 中作为一等对象的函数解析
2019/12/11 Python
matplotlib之pyplot模块坐标轴标签设置使用(xlabel()、ylabel())
2021/02/22 Python
Stylenanda中文站:韩国一线网络服装品牌
2016/12/22 全球购物
Skyscanner波兰:廉价航班
2017/11/07 全球购物
计算机毕业大学生推荐信
2013/12/01 职场文书
优秀电子工程系毕业生求职信
2014/05/24 职场文书
房产协议书范本2014
2014/09/30 职场文书
2014年团工作总结
2014/11/27 职场文书
乔布斯辞职信(中英文对照)
2015/05/12 职场文书
创业的9条正确思考方式
2019/08/26 职场文书
某学校的2019年度工作报告范本
2019/10/11 职场文书
基于Python实现的购物商城管理系统
2021/04/27 Python
Docker下安装Oracle19c
2022/04/13 Servers