js学习第五天

96 阅读3分钟

对象

语法

声明一个对象类型的变量与之前声明一个数值或字符串类型的变量没有本质上的区别。

 <script>
    // 声明字符串类型变量
    let str = 'hello world!'
    
    // 声明数值类型变量
    let num = 999

    // 声明对象类型变量,使用一对花括号
    // user 便是一个对象了,目前它是一个空对象
    let user = {}
  </script>

属性和访问

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

  1. 属性都是成 对出现的,包括属性名和值,它们之间使用英文 : 分隔
  2. 多个属性之间使用英文 , 分隔
  3. 属性就是依附在对象上的变量
  4. 属性名可以使用 ""'',一般情况下省略,除非名称遇到特殊符号如空格、中横线等
 <script>
    // 通过对象描述一个人的数据信息
    // person 是一个对象,它包含了一个属性 name
    // 属性都是成对出现的,属性名 和 值,它们之间使用英文 : 分隔
    let person = {
      name: '小明', // 描述人的姓名
      age: 18, // 描述人的年龄
      stature: 185, // 描述人的身高
      gender: '男', // 描述人的性别
    }
  </script>

声明对象,并添加了若干属性后,可以使用.[]获得对象中属性对应的值,称之为属性访问。

<script>
    // 通过对象描述一个人的数据信息
    // person 是一个对象,它包含了一个属性 name
    // 属性都是成对出现的,属性名 和 值,它们之间使用英文 : 分隔
    let person = {
      name: '小明', // 描述人的姓名
      age: 18, // 描述人的年龄
      stature: 185, // 描述人的身高
      gender: '男', // 描述人的性别
    };
    
    // 访问人的名字
    console.log(person.name) // 结果为 小明
    // 访问人性别
    console.log(person.gender) // 结果为 男
    // 访问人的身高
    console.log(person['stature']) // 结果为 185
   // 或者
    console.log(person.stature) // 结果同为 185
  </script>

扩展:也可以动态为对象添加属性,动态添加与直接定义是一样的,只是语法上更灵活。


  <script>
    // 声明一个空的对象(没有任何属性)
	let user = {}
    // 动态追加属性
    user.name = '小明'
    user['age'] = 18
    
    // 动态添加与直接定义是一样的,只是语法上更灵活
  </script>

方法和调用

数据行为性的信息被称为方法,如唱、跳、rap、打篮球等,一般是动词性的,其本质是函数。

  1. 方法是由方法名和函数两部分构成,它们之间用:分隔
  2. 多个属性之间使用英文,分隔
  3. 方法是依附在对象中的函数
  4. 方法名可以使用""'',一般情况下省略,除非遇到特殊符号,如空格、中横线等
<script>
  // 方法是依附在对象上的函数
  let person = {
    name: '小红',
    age: 18,
    // 方法是由方法名和函数两部分构成,它们之间使用 : 分隔
    singing: function () {
      console.log('两只老虎,两只老虎,跑的快,跑的快...')
    },
    run: function () {
      console.log('我跑的非常快...')
    }
  }
</script>

声明对象,并添加了若干方法后,可以使用 .[] 调用对象中函数,我称之为方法调用。

<script>
  // 方法是依附在对象上的函数
  let person = {
    name: '小红',
    age: 18,
    // 方法是由方法名和函数两部分构成,它们之间使用 : 分隔
    singing: function () {
      console.log('两只老虎,两只老虎,跑的快,跑的快...')
    },
    run: function () {
      console.log('我跑的非常快...')
    }
  }
  
  // 调用对象中 singing 方法
  person.singing()
  // 调用对象中的 run 方法
  person.run()

</script>

扩展:也可以动态为对象添加方法,动态添加与直接定义是一样的,只是语法上更灵活。

<script>
  // 声明一个空的对象(没有任何属性,也没有任何方法)
  let user = {}
  // 动态追加属性
  user.name = '小明'
  user.['age'] = 18
  
  // 动态添加方法
  user.move = function () {
    console.log('移动一点距离...')
  }
  
</script>

注:无论是属性或是方法,同一个对象中出现名称是一样的,后面的会覆盖前面的

null
null 也是JavaScript 中数据类型的一种,通常用它来表示不存在的对象。使用typeof 检测它的类型时,结果为 object

遍历对象

let obj = {
  uname: 'pink'
}
for(let k in obj) {
  // k 属性名  字符串  带引号    obj.'uname'     k ===  'uname'
  // obj[k]  属性值    obj['uname']   obj[k]
}

for in 不提倡遍历数组 因为 k 是 字符串

内置对象

我们曾经使用过的 console.logconsole其实就是 JavaScript 中内置的对象,该对象中存在一个方法叫 log,然后调用 log 这个方法,即 console.log()

除了 console 对象外,JavaScritp 还有其它的内置的对象

Math

Math是JavaScript 中内置的对象,称为数学对象,这个对象下即包含了属性,也包含了许多方法。

属性

Math.PI ,获取圆周率

// 圆周率
console.log(Math.PI);

方法

- Math.random,生成0到1之间的随机数

// 0 ~ 1 之间的随机数, 包含 0 不包含 1
Math.random()
  • Math.ceil ,数字向上取整
// 舍弃小数部分,整数部分加1
Math.ceil(3.4)  //4
  • Math.floor ,数字向下取整
// 舍弃小数部分,整数部分不变
Math.floor(3.4) //3
  • Math.round,四舍五入取整
// 取整,四舍五入原则
Math.round(5.46539)
Math.round(4.849)
  • Math.max,在一组数中找出最大的
// 找出最大值
Math.max(10, 21, 7, 24, 13) //24
  • Math.min,在一组数中找出最小的
// 找出最小值
Math.min(24, 18, 6, 19, 21) //6
  • Math.pow,幂方法
// 求某个数的多少次方
Math.pow(4, 2) // 求 4 的 2 次方
Math.pow(2, 3) // 求 2 的 3 次方
  • Math.sqrt,平方根
// 求某数的平方根
Math.sqrt(16)

得到一个区间的随机整数

function getRandom(min,max)  {

 return Math.floor(Math.random()*(max-min+1) ) + min
}
getRandom(1,10) //得到1~10之间的随机整数