js遍历对象的属性和方法

一、总结

二、实例

练习1：具有默认值的构造函数

  • 实例描述：

    有时候在创建对象时候，我们希望某些属性具有默认值

  • 案例思路：

    在构造函数中判断参数值是否为undefined，如果是就为其制定一个默认值。

练习2：遍历对象属性和方法

  • 实例描述：

    通过for...in...语句遍历对象中的数据，包括属性和方法

  • 案例思路：

    for...in语句和if判断分别遍历对象的属性和方法。

三、代码

 <!DOCTYPE html>

 <html lang="zh-cn">

 <head>

     <meta charset="utf-8">

     <title>课堂演示</title>

 </head>

 <body>

  <script type="text/javascript">

  /*

  function Hero(type,home,weapon){

      this.type=type;

     this.home=home;

     // if (weapon==undefined) {

     //     this.weapon='剑';

     // }else{

     //     this.weapon=weapon;

     // }

     this.weapon=weapon?weapon:'剑'



  }

  var user=new Hero('战士','新手村','斧子')

  alert(user.type+'\n'+user.home+'\n'+user.weapon)

  */

   function Hero(name,type,home,weapon){

       this.name=name;

      this.type=type;

     this.home=home;

     this.weapon=weapon?weapon:'剑' ;

     this.skill=function(){

           alert(this.name+'向敌人发动了普通攻击')

     }

  }

  var user=new Hero('阿吉','战士','新手村')

  document.write('user包含如下属性和方法：<hr/>')

  for (var i in user) {

      document.write(i+':'+user[i]+'<br/>')

  }

  </script>

 </body>

 </html>

1、判断变量是否定义：第13行，判断一个属性是否未定义

2、元素属性默认值的实质（if判断）：第18行，三元运算符实现元素属性默认值

3、this关键字：第26行，函数内元素添加属性

4、函数内定义方法：第30行

5、for+in遍历对象：第37行，i就是属性名或者函数名

6、对象[索引]：第38行，是对应对象索引位置的值，这个索引是属性名或者函数名

截图

js遍历对象的属性和方法的更多相关文章

  1. JS遍历对象的属性和值

    对于需要动态获取对象的某些属性和对应的值的时候,就需要遍历对象的属性和值. const user = { name: '张三', age: 20, addr: '湖北武汉', sex: '男' } / ...

  2. JS遍历对象的几种方法

    几天前一个小伙伴问我 Object.getOwnPropertyNames() 是干什么用的 平时还真没有使用到这个方法,一时不知如何回答 从方法名称来分析,应该是返回的是对象自身属性名组成的数组 那 ...

  3. 辨析js遍历对象与数组的方法

    1     遍历对象的方法? (1) for-in(也可遍历数组,但效率较低,一般用来遍历对象) 示例: // 生成一个原型上有属性并且有可枚举属性与不可枚举属性的对象 const data = Ob ...

  4. js浏览器对象的属性和方法

    1.window对象 /*1.计算浏览器窗口大小*/ //不算滚动条: var width = window.innerWidth; var height = window.innerHeight; ...

  5. js Dom对象的属性与方法

    1.对象集合:      (1).all[];      (2).images[];      (3).anchors[];      (4).forms[];      (5).links[];   ...

  6. JS遍历对象修改属性名

    根据接口返回数据中number属性值,对数据进行截取,并改变属性名.直接上码: 下面是需要处理的数据 let data={"minValue":7400, "maxVal ...

  7. js遍历对象的属性并且动态添加属性

    var person= { name: 'zhangsan', pass: '123' , 'sni.ni' : 'sss', hello:function (){ for(var i=0;i< ...

  8. js 宿主对象的属性和方法总结

    (1)属性:       //height,width;           a=document.documentElement.clientHeight;           //文档可视高度,由 ...

  9. JS 输出对象的属性以及方法[转载]

    <script>var obj  = {attribute:1,method:function() {alert("我是函数");}}for (var i in obj ...

随机推荐

  1. Python(十) 函数式编程： 匿名函数、高阶函数、装饰器

    一.lambda表达式 lambda parameter_list: expression # 匿名函数 def add(x,y): return x+y print(add(1,2)) f = la ...

  2. react 常用的ui库

    1. https://ant.design/docs/react/introduce-cn   ANT DESIGNui 2. http://www.material-ui.com/#/   Mate ...

  3. 关于viewport详解

  4. 使用iVMS-4200 存储录像数据时的设置

    1.安装软件时,选择:存储服务器 2.对存储服务器进行配置,具体配置见 配置手册.

  5. React开发实时聊天招聘工具 -第五章 需求分析

    Axios的使用 axios.get('/data') .then(res=>{ if(res.status==200) this.setState(data:res.data) })

  6. Javascript 模块化理解

    原始时代: script标签引入javascript文件 -------- html ------- <div id="result"></div> < ...

  7. DotNetCore2.1 下Docker使用的学习

    [环节1:CentOS 安装Docker] Step1:通过 uname -r 命令查看你当前的内核版本 uname -r Step2:使用 root 权限登录 Centos.确保 yum 包更新到最 ...

  8. ajax动态更新下拉列表

    前面做了一个ajax的小demo,今天看一个动态更新下拉列表,或者也叫级联更新下拉列表,这个也是利用ajax的异步调用去后台实现数据请求.然后回到前台完毕下拉列表数据的更新,以增强web应用的交互性. ...

  9. ubuntu adb 安装

    ubuntu 下adb 安装,其实就是下载一个adb,然后给它赋予可执行权限,最后在环境变量里添加一下罢了.具体如下 1.下载adb 这个工具其实是在sdk工具包里面的platform-tools文件 ...

  10. C#开发 —— 基础知识

    C# 用于开发可以运行在 .Net 平台上的应用程序,C# 本身只是一种语言,尽管它是用于生成面向 .Net 环境的代码,但它本身不是 .Net 的一部分 Console.WriteLine 命名空间 ...