详细谈谈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自动显示最后更新时间
Mar 15 Javascript
用JS实现的一个include函数
Jul 21 Javascript
js 弹出框只弹一次(二次修改之后的)
Nov 26 Javascript
jquery遍历select元素(实例讲解)
Dec 31 Javascript
node.js中的定时器nextTick()和setImmediate()区别分析
Nov 26 Javascript
jquery插件ajaxupload实现文件上传操作
Dec 09 Javascript
request请求获取参数的实现方法(post和get两种方式)
Sep 27 Javascript
Bootstrap中datetimepicker使用小结
Dec 28 Javascript
JavaScript自动点击链接 防止绕过浏览器访问的方法
Jan 19 Javascript
Vue之Vue.set动态新增对象属性方法
Feb 23 Javascript
Node.js 利用cheerio制作简单的网页爬虫示例
Mar 01 Javascript
使用axios发送post请求,将JSON数据改为form类型的示例
Oct 31 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
咖啡店都有些什么常规豆子呢?有什么风味在里面
2021/03/04 咖啡文化
THINKPHP+JS实现缩放图片式截图的实现
2010/03/07 PHP
PHP伪静态Rewrite设置之APACHE篇
2014/07/30 PHP
PHP Try-catch 语句使用技巧
2016/02/28 PHP
PHP使用微信开发模式实现搜索已发送图文及匹配关键字回复的方法
2017/09/13 PHP
phpQuery采集网页实现代码实例
2020/04/02 PHP
js 变量类型转换常用函数与代码[比较全]
2009/12/01 Javascript
JavaScript版DateAdd和DateDiff函数代码
2012/03/01 Javascript
cookie在javascript中的使用技巧以及隐私在服务器端的设置
2012/12/03 Javascript
百度地图api应用标注地理位置信息(js版)
2013/02/01 Javascript
JS嵌套函数调用上下文的问题解决
2014/03/26 Javascript
JavaScript中实现依赖注入的思路分享
2015/01/15 Javascript
require.js的用法详解
2015/10/20 Javascript
Document.body.scrollTop的值总为零的快速解决办法
2016/06/09 Javascript
基于BootstrapValidator的Form表单验证(24)
2016/12/12 Javascript
微信小程序 简单教程实例详解
2017/01/13 Javascript
Javascript for in的缺陷总结
2017/02/03 Javascript
jQuery实现IE输入框完成placeholder标签功能的方法
2017/09/20 jQuery
Vue 实现展开折叠效果的示例代码
2018/08/27 Javascript
关于Vue Router中路由守卫的应用及在全局导航守卫中检查元字段的方法
2018/12/09 Javascript
Mint UI组件库CheckList使用及踩坑总结
2018/12/20 Javascript
微信小程序事件 bindtap bindinput代码实例
2019/08/26 Javascript
JS数据类型分类及常用判断方法
2020/11/19 Javascript
[01:06:54]DOTA2-DPC中国联赛 正赛 RNG vs Dragon BO3 第一场 1月24日
2021/03/11 DOTA
Python之reload流程实例代码解析
2018/01/29 Python
浅谈Tensorflow模型的保存与恢复加载
2018/04/26 Python
python在html中插入简单的代码并加上时间戳的方法
2018/10/16 Python
Python 如何批量更新已安装的库
2020/05/26 Python
matplotlib 多个图像共用一个colorbar的实现示例
2020/09/10 Python
python中的垃圾回收(GC)机制
2020/09/21 Python
水务局局长岗位职责
2013/11/28 职场文书
公司人力资源的自我评价
2014/01/02 职场文书
2014教师研修学习体会
2014/07/08 职场文书
2014镇党委班子对照检查材料思想汇报
2014/09/23 职场文书
2014年保洁工作总结
2014/11/24 职场文书
使用CSS实现音波加载效果
2023/05/07 HTML / CSS