JavaScript 基础知识回顾与复习---对象

95 阅读7分钟

对象

对象可以说是JavaScript中最重要的一部分了,对象中包裹的是属性,当然也可以包含一个函数,因为函数也是一种数据,我们称之为对象的方法。通常以键值对的形式出现,像key: value这样子

定义一个对象:
var obj = {
    name: 'geigei',
    getName: function(){
        return obj.name || this.name
    }
}
obj.getName() // geigei
读取对象

通常读取一个对象用 . 的语法来读取,通过数组 [] 方括号的方式来读取也是可以的。

var C = {
    name: '武松',
    age: 18,
    getName: function(){
        return this.name
    }
}
C.name // 武松
C['age'] // 18

当一个对象的属性是动态的时候,此时我们就可以利用方括号语法动态的传递一个变量去读取。

var key = 'firstname'
var obj2 = {
    firstname: '阮小七',
    lastname: '白胜'
}
obj2[key] // 阮小七
修改属性与方法

JavaScript是一种动态语言,所以我们可以随时修改对象的属性和方法,包括添加和删除

为对象添加一个属性

var obj3 = {
    name: '李明',
    age: 18:
}
obj3.gender = '男'
obj3.gender // 男

删除对象的一个属性

delete obj3.gender
obj3.gender // undefined
对象中的this

对象中的this其实就是指向该对象

var obj4 = {
    name: '小美',
    getname: function(){
        return this.name // 小美
    }
}
构造函数

构造函数通常可以用来创建一个对象,但它同时也是一个普通函数,也能作为普通函数来使用。通过new 操作符来创建一个构造函数。

function Fun1(name, age, gender){
    this.name = name
    this.age = age
    this.gender = gender
    this.getname = function (){
        return this.name
    }
}
const p1 = new Fun1('武松', 18, '男')
console.log(p1.name) // 武松
console.log(p1.getname()) // 武松

通过构造函数创建一个对象会经历以下步骤:

1.创建一个新对象

2.将构造函数的作用域赋值给新对象(this指向了这个对象)

3.执行构造函数中的代码(为新对象添加属性)

4.返回新对象

构造函数作为普通函数来使用

Fun1('宋江', 189, '男') // 添加到 window
console.log(window.age)// 189
instanceof

instanceof 可以用来检测对象是否为某个构造函数创建的

以Fun1为例
p1 instanceof Fun1 // true
传递对象

我们在拷贝或者将一个对象传递给一个变量时候,往往传递的是对象的引用,此时在引用对象上所做的任何改动都会影响到原对象

 var objA = {num: 10}
    var test = objA;
    console.log(test.num) // 10
    test.num = 99
    console.log(test.num) // 99
Object

Object是所有对象的顶层父对象,我们创建出来的对象都是继承自Object。

新建一个对象:

var o = {}

或者

var o = new Object()

他们两者是等价的

对象的部分属性和方法:

constructor 返回构造函数的引用

toString() 返回对象的字符串形式

valueOf() 返回对象本身

a.constructor // Object() { [native code] }
a.toString() // [object Object]
a.valueOf()  // {}
Array

其实数组也是一种对象,继承自Object,新建一个数组也可以用两种方法

var arr = []
var arr = new Array()
两者是等价的

当通过构造器创建数组时,可以直接传递一些数组元素进去

var arr1 = new Array(1,2,3,4,5,'test') //[1,2,3,4,5,'test']

当传递传递参数只有一个时,这个参数就会成为数组的长度

var arr2 = new Aarray(4) 
// [
    null,
    null,
    null,
    null
]

如果对 length 设置的参数大于数组长度的时候,剩下的部分会自动被创建,如果小于数组的长度,多余的部分就会被删除

一些数组自有的方法

push ()为数组的末尾添加元素

pop ()删除数组最后一个元素

sort() 为数组元素排序

join() 接收一个参数,并将数组转为字符串的形式,数组每一个元素之间以指定的字符分隔

slice() 截取数组元素,不改变原数组

 console.log(arr1.slice(0,2))
 // [1,2,3,4,5,'test']

splice() 移除数组元素,会改变原数组

 console.log(arr1.slice(0,2))
 // [3, 4, 5, 'test']

除了数组自有的方法之外,它是一个对象当然是继承自Object,所以也可使用valueOf(),toString(),constructor

Function

Function也是一种对象,可以叫它函数对象。有几种创建方式:

function fun(name){
    return this.name
}
var fun = function(name){
    return this.name
}
var fun = new Function('a,b', 'return a+b')
// 这种方式创建函数的时候需要指定参数和函数体,通常是字符串

函数对象的属性

constructor 返回函数构造器的引用

length 返回函数参数的数量

prototype 指向一个对象

函数对象的方法

valueOf() 返回函数本身

toString() 返回函数的字符串形式

call() 和apply()

每一个函数都有call()和apply() 方法,它可以让一个对象借用另一个对象的方法,或者说可以改变函数中this的指向

// call()
    var obj1 = {
      name: '小米',
      sayName: function(val){
        return 'name is ' + val + 'and' + this.name

      }
    }
   var obj2 = {
    name: '万达'
   }
   
   obj1.sayName.call(obj2, '李四') 
   // name is 李四and万达
  //  2. apply() 写法差不多只不过参数要是一个数组
  obj1.sayName.apply(obj2,['王六'])
  name is 王六and万达

arguments对象

arguments 对象一般来描述函数的参数个数,它类似与一个数组但并不是真正的数组,因为它提供数组的一般方法,像push(),pop()...

但可以将arguments 转为数组,这样他就可以使用数组的方法了,如下:

function f(){
    var args = [].slice.call(arguments)
    return arge
}

推断对象类型

Object.prototype.toString.call({}) // [object Object]
Object.prototype.toString.call([]) // [object Array]
Boolean对象

声明一个布尔对象,它并不是基本数据类型的Boolean,而是一个对象

var obj = new Boolean()
typeof b // Object

如果想将b转成基本数据类型的布尔值,可以使用valueof方法

b.valueof() // false

总之而言布尔对象并没有什么实用性可言,因为它没有提供来自父对象的任何属性和方法。如果不适用new 操作符直接使用Boolean()可以将任意值转为布尔值

Number

Number对象与Boolean对象类似,作为构造器函数使用时会创建一个对象,作为一般函数使用时,会将传入的值转为数字

toFixed() // 四舍五入
 toPrecision() // 把数字格式化为指定的长度
 var n = 31.2343
 n.toPrecision(2) // 31
 toExponential() // 把对象的值转换成指数计数法
 var n1 = 5.56789;
 n1.toExponential()
 // 5.56789e+0
String对象

我们也可以通过String构造器函数来创建String对象,该对象为我们提供了一系列操作文本的方法

var str = new String('hello')
typeof str // Object
str.length // 5
str[0] // h
str[4] // o
string对象的一些方法
var str = new String('hello')
toUpperCase() // 将一个字符串转为大写
str.toUpperCase() // HELLO
toLowerCase() // 将一个字符串转为小写
str.toLowerCase() // hello
chatAt() 返回指定位置的字符串
str.charAt(2) // l
indexOf() // 查找字符串,会返回第一次查找到的字符串所在位置的索引值,没找到就会返回-1
lastIndexOf() // 从后往前查找
slice() 返回指定位置区间的字符串
str.slice(0,2) // he
substring() // 与slice用法一样,区别在于他们对于负值参数的处理,slice会将它与字符串的长度相加,substring会将负值视为0
split() // 将字符串以指定字符分割为一个数组
str.split('e') // ['h', 'llo']
concat() // 用来合并字符串
Math

Math对象是有别于我们之前所见到过的其他全局内建对象,它不是对象函数,所以不能调用new 操作符来创建别的对象。实际上Math对象只是包含了一些方法和属性,用于数学计算的全局内建对象

Math.PI // 3.141592653589793
Math.random() // 在0和1之间生成一个随机数
如果想生成0100之间的随机数可以:
Math.random() * 100 // 20.79368252297298
如果要获取max和min两值之间的随机数可以使用这样的公式:
((max - min) * Math.random()) + min

如果需要一个整数的话可以使用一下方法来实现

floor() // 取小于或等于指定值的最大整数
ceil() // 取大于或等于指定值的最小整数
round() // 取最靠近指定值的整数
Math.round(Math.random()) // 不是0就是1
Date对象

Date() 是用来创建Date对象的构造器函数

new Date() // 获取到当前时间
也可以给它传入参数来指定时间
new Date(2022,10,1) 月份是从0开始的,实际上是11// Tue Nov 01 2022 00:00:00 GMT+0800 (中国标准时间)
Error对象

try,catch,finally

try,catch语句通常用来捕获js代码在执行过程中的错误,可以对捕获到的错误做进一步的处理,

try{
    // 要执行的代码
}catch(e){
    // 错误
}finally{
	
}
finally不管何种情况它都会执行(是否有错误发生)