JS对象
万物都是对象
- 布尔是对象(如果用 new 关键词定义)
- 数字是对象(如果用 new 关键词定义)
- 字符串是对象(如果用 new 关键词定义)
- 日期永远都是对象
- 算术永远都是对象
- 正则表达式永远都是对象
- 数组永远都是对象
- 函数永远都是对象
- 对象永远都是对象
JS定义了5种原始数据类型:
- string
- number
- boolean
- null
- undefined
var person = {firstName:"Bill", lastName:"Gates", age:62, eyeColor:"blue"};
创建对象的时候需要满足属性+属性值
Object是万物的对象,可以不适用Object来new
JS对象的属性
访问对象的属性可以
对象.属性
对象[“属性”]
对象属性的遍历
var person = {fname:"Bill", lname:"Gates", age:62};
for (x in person) {
txt += person[x];
}
添加属性完全可以使用
对象.属性(要添加的属性)= “对应的的属性值”
person.name = "xiaoming";
删除属性delete
var person = {firstName:"Bill", lastName:"Gates", age:62, eyeColor:"blue"};
delete person.age; // 或 delete person["age"];
delete
关键词会同时删除属性的值和属性本身。
删除完成后,属性在被添加回来之前是无法使用的。
delete
操作符被设计用于对象属性。它对变量或函数没有影响。
delete
操作符不应被用于预定义的 JavaScript 对象属性。这样做会使应用程序崩溃。
JS对象方法
能够在对象上执行的动作
this关键字
this
的值,在函数中使用时,是“拥有”该函数的对象。
请注意 this
并非变量。它是关键词。您无法改变 this
的值。
访问对象的方法。
method Name:function(){
}
调用方法就是在这个**方法名字()**和其他编程语言一样
如果调用函数的时候你没有使用(),他会返回函数的定义()
使用内建方法就是该方法JS已经提前定义好了。
比如使用 String 对象的 toUpperCase()
方法
JS显示对象
const person = {
name: "Bill",
age: 19,
city: "Seattle"
};
document.getElementById("demo").innerHTML = person;
显示对象的属性
const person = {
name: "Bill",
age: 19,
city: "Seattle"
};
document.getElementById("demo").innerHTML =
person.name + "," + person.age + "," + person.city;
在循环中显示对象
const person = {
name: "Bill",
age: 19,
city: "Seattle"
};
let txt = "";
for (let x in person) {
txt += person[x] + " ";
};
document.getElementById("demo").innerHTML = txt;
将对象转换为数组
const person = {
name: "Bill",
age: 19,
city: "Seattle"
};
//Object.values(对象名称)返回值为数组
const myArray = Object.values(person);
document.getElementById("demo").innerHTML = myArray;
将日期转化为字符
JSON.stringify(对象)
JS的get关键字
// 创建对象:
var person = {
firstName: "Bill",
lastName : "Gates",
language : "en",
get lang() {
return this.language;
}
};
// 使用 getter 来显示来自对象的数据:
document.getElementById("demo").innerHTML = person.lang;
JS的set关键字
var person = {
firstName: "Bill",
lastName : "Gates",
language : "",
set lang(lang) {
this.language = lang;
}
};
// 使用 setter 来设置对象属性:
person.lang = "en";
// 显示来自对象的数据:
document.getElementById("demo").innerHTML = person.language;
仔细分析两种方式的区别:
//第一种方式
var person = {
firstName: "Bill",
lastName : "Gates",
fullName : function() {
return this.firstName + " " + this.lastName;
}
};
// 使用方法来显示来自对象的数据:
document.getElementById("demo").innerHTML = person.fullName();
//第二种方式、(这是我比较喜欢的方式)
var person = {
firstName: "Bill",
lastName : "Gates",
get fullName() {
return this.firstName + " " + this.lastName;
}
};
// 使用 getter 来显示来自对象的数据:以属性的方式不加()
document.getElementById("demo").innerHTML = person.fullName;
JS对象构造器就是你new的时候的那个大写字母的那个类(好像只有我能看懂)
prototype 属性允许您为对象构造器添加新属性
function Person(first, last, age, eyecolor) {
this.firstName = first;
this.lastName = last;
this.age = age;
this.eyeColor = eyecolor;
}
Person.prototype.nationality = "English";
ES5对象方法
// 以现有对象为原型创建对象
Object.create()
// 添加或更改对象属性
Object.defineProperty(object, property, descriptor)
// 添加或更改对象属性
Object.defineProperties(object, descriptors)
// 访问属性
Object.getOwnPropertyDescriptor(object, property)
// 以数组返回所有属性
Object.getOwnPropertyNames(object)
// 访问原型
Object.getPrototypeOf(object)
// 以数组返回可枚举属性
Object.keys(object)
// 防止向对象添加属性
Object.preventExtensions(object)
// 如果属性可以添加到对象,则返回 true
Object.isExtensible(object)
// 防止更改对象属性(不是值)
Object.seal(object)
// 如果对象被密封,则返回 true
Object.isSealed(object)
// 防止对对象进行任何更改
Object.freeze(object)
// 如果对象被冻结,则返回 true
Object.isFrozen(object)
JS Map对象 (学这个特别容易和java弄混)
- Map 对象存有键值对,其中的键可以是任何数据类型。
- Map 对象记得键的原始插入顺序。
- Map 对象具有表示映射大小的属性。
基本的Map()方法
Method | Description |
---|---|
new Map() | 创建新的 Map 对象。 |
set() | 为 Map 对象中的键设置值。 |
get() | 获取 Map 对象中键的值。 |
entries() | 返回 Map 对象中键/值对的数组。 |
keys() | 返回 Map 对象中键的数组。 |
values() | 返回 Map 对象中值的数组。 |
JS Set对象的方法和属性
new Set() | 创建新的 Set 对象。 |
---|---|
add() | 向 Set 添加新元素。 |
clear() | 从 Set 中删除所有元素。 |
delete() | 删除由其值指定的元素。 |
entries() | 返回 Set 对象中值的数组。 |
has() | 如果值存在则返回 true。 |
forEach() | 为每个元素调用回调。 |
keys() | 返回 Set 对象中值的数组。 |
values() | 与 keys() 相同。 |
size | 返回元素计数。 |