javaScript 04 对象的使用

1d43f75f092a4050a8ce31e2d85f6868.gif

博       主:初映CY的前说(前端领域)

个人信条:想要变成得到,中间还有做到!

本文核心:对象概念、对象的属性与方法的使用、常见的内置对象

目录

前言

一、对象是什么?

二、对象使用

1.声明对象

2.1对象中属性

        对象属性的书写方式:

        对象属性的增删改查操作

2.2对象中方法

        对象方法的书写方式:

        对象属性的增删改查操作

三.对象的相关操作

四.内置对象

                1.1内置对象是什么?

                1.2内置对象Math


前言

  • 理解什么是对象,掌握定义对象的语法 掌握数学对象的使用
  • 掌握数学对象的使用

一、对象是什么?

  • 对象 对象是 JavaScript 数据类型的一种,之前已经学习了数值类型、字符串类型、布尔类型、undefined。
  • 对象数据类型可以被理解成是一种数据集合。它由属性和方法两部分构成。

二、对象使用

1.声明对象

let 对象名={ 这里存放属性与方法}

2.1对象中属性

数据描述性的信息称为属性,如人的姓名、身高、年龄、性别等,一般是名词性的。

  1.  属性都是成 对出现的,包括属性名和值,名与值之间使用英文 : 分隔
  2. 多个属性之间使用英文 , 分隔
  3.  属性就是依附在对象上的变量
  4. 属性名可以使用 "" 或 '' ,一般情况下省略,除非名称遇到特殊符号如空格、中横线等。

 对象属性的书写方式:




    
    
    
    Document


    


对象属性的增删改查操作

 我先定义一个名为goods的对象

javaScript 04 对象的使用_第1张图片

1.查找对象属性        格式:对象名.属性(返回的是属性值)

左侧查语法,右侧页面查看

javaScript 04 对象的使用_第2张图片

2.修改对象属性        格式:对象名.属性 =新值

javaScript 04 对象的使用_第3张图片

 控制台查看

3.增加对象属性         格式: 对象名.新属性名=新值

javaScript 04 对象的使用_第4张图片

 控制台查看javaScript 04 对象的使用_第5张图片

4.删除对象属性         格式: delete 对象名.属性名

控制台查看javaScript 04 对象的使用_第6张图片

附上对象属性的增删改查的全部代码与笔记





    
    
    
    Document



    



2.2对象中方法

数据行为性的信息称为方法,如跑步、唱歌等,一般是动词性的,其本质是函数。

  1. 方法是由方法名和函数两部分构成,它们之间使用 : 分隔
  2. 多个属性之间使用英文 , 分隔
  3. 方法是依附在对象中的函数
  4. 方法名可以使用 "" 或 '' ,一般情况下省略,除非名称遇到特殊符号如空格、中横线等

  对象方法的书写方式:





    
    
    
    Document



    


对象方法的增删改查操作

我先定义一个对象存放方法:

javaScript 04 对象的使用_第7张图片

 1.查找对象方法        格式:对象名.方法名()

 控制台查看

2.修改对象方法        格式:对象名.方法名=function{}

javaScript 04 对象的使用_第8张图片

 控制台查看

3.增加对象方法        格式:对象名.方法名=function{}

javaScript 04 对象的使用_第9张图片

      

4.删除操作        格式:delete 对象名.方法名

 控制台查看

附上对象属性的增删改查的全部代码与笔记





    
    
    
    Document



    


三.对象的相关操作

1.遍历对象         格式:for(变量 in 对象名){}





    
    
    
    Document



    


控制台查看

javaScript 04 对象的使用_第10张图片

 2.拓展:数组使用对象中的遍历方式        格式:for(变量 in 数组名){}




    
    
    
    Document


    

控制台查看javaScript 04 对象的使用_第11张图片

3.数组配合对象渲染数组使用





    
    
    
    Document
    





控制台查看

javaScript 04 对象的使用_第12张图片

四.内置对象

1.1内置对象是什么?

JavaScript内部提供的对象,包含各种属性和方法给开发者调用

我们之前是用过内置对象 ➢  document.write()  ➢ console.log()

1.2内置对象Math

Math对象是JavaScript提供的一个“数学”对象

作用:提供了一系列做数学运算的方法

官方Math文档:Math - JavaScript | MDN (mozilla.org)

web中常用的Math方法:

random:生成0-1之间的随机数(包含0不包括1)

  • ceil:向上取整
  • floor:向下取整
  • max:找最大数
  • min:找最小数
  • pow:幂运算
  • abs:绝对值

下面举几个例子:




    
    
    
    Document


    

1.2.1Math.random随机数使用




    
    
    
    Document


    

下面是调用Math官方获取区间值的函数生成的





    
    
    
    Document



    


1.2.2颜色获取案例(这个很重要)





    
    
    
    Document
    



    


    


你可能感兴趣的:(javaScript,html5,javascript,前端,html,css)