JavaScript 对象
JavaScript是一种面向对象编程(OOP)语言。
JS对象的特性
封装-将相关信息(无论是数据还是方法)一起存储在一个对象中的能力。
聚合——将一个对象存储在另一个对象中的能力。
继承——一个类的某些属性和方法依赖于另一个类(或多个类)的能力。
多态——编写一个函数或方法以多种不同方式工作的能力。
对象由特性(attribute)组成
如果一个特性包含一个函数,它被认为是对象的一个方法(method),否则特性被认为是一个属性(property)。
JS对象的属性
对象属性可以是三种基本数据类型中的任何一种(数字,字符串,布尔值)
也可以是任何抽象数据类型,比如另一个对象。
对象属性通常是在对象的方法内部使用的变量,但也可以是在整个页面中使用的全局可见的变量。
向对象添加属性
语法:
objectName.objectProperty = propertyValue;
例如,下面的代码使用文档对象的“title”属性获取文档标题。
var str = document.title;
JS对象的方法
方法是让对象做某件事或者对对象做某件事的函数。
方法被视为对象的行为。
函数和方法之间有一个小的区别:
- 函数是一个独立的语句单元。
- 方法是添加到一个对象上的,可以通过this关键字引用。
- 即方法是一种特殊的函数
下面的例子展示了如何使用document对象的write()方法在文档上写入内容。
document.write("要写入的文档内容");
用JavaScript脚本创建对象
JavaScript可以用4种方式创建对象:
直接使用对象字面量
"new" 关键字
ES6中可以使用class
使用create()
对象字面量
通过语法规定的写法书写的文本即字面量,然后由js解析器进行解析并创建对象:
var database = { db : "test", table : "sql" };
操作符 new
new操作符用于创建对象的实例。
要创建对象,new操作符后面跟着构造函数方法。
在下面的例子中,构造函数方法是Object()、Array()和Date()。
这些构造函数是内置的JavaScript函数。
var student = new Object(); var books = new Array("C++", "Perl", "Java"); var day = new Date("2010-01-01");
在上面的示例中,Object()、Array()和Date()是构造函数方法,它们是内置的JavaScript函数。
ES6中使用 class 创建对象
ECMAScript6中的class为创建一个新的JScript对象而定义的语法。
尽管JScript是OOP的语言,但在Ecmascript6之前,JavaScript并没有使用class。
Class student { Constructor (Name, Age) { this.Name = Name; this.Age = Age; this.getName = function() { return "学生信息:" + this.Name + this.Age; } } } var database = new student("Brad", 25);
使用create()创建对象
Object.create是JavaScript中的预构建对象类型。当创建一个新对象时,object.create() 方法将使用对象字面量作为原型。
var student = { Name: "Bob", Age: 45, getName: function() { return "学生信息:" + this.Name + this.Age; } }; var Stu1 = Object.create(student); Stu1.Name = "Hyman"; Stu1.Age = 25;
用户自定义的对象
所有用户定义的对象和内置对象都是object对象的后代(都继承自Object对象)。
Object()构造函数
构造函数是用于创建和初始化对象的函数。
JavaScript提供了一个特殊的构造函数Object()来构建对象。
将Object()构造函数的返回值被分配给一个变量。那么该变量包含对新对象的引用。
JavaScript如何创建对象示例
var book = new Object(); // 创建一个对象 book.subject = "Perl"; // 添加属性并赋值 book.author = "Larry Wall"; console.log("book对象的属性subject: " + book.subject ); console.log("book对象的属性author: " + book.author );
示例-js中如何通过用户定义函数来创建对象
this关键字用于引用传递给函数的对象。
function book(title, author) { this.title = title; this.author = author; } var myBook = new book("Perl", "Larry"); console.log("对象myBook的属性subject: " + book.subject ); console.log("对象myBook的属性author: " + book.author );
js如何在对象中定义方法
前面的示例演示了构造函数如何创建对象和分配属性。
但是我们还需要通过给对象分配方法来完成一个完整对象的定义。
JavaScript 在对象中添加方法示例
下面的例子展示了如何添加一个函数到对象中,从而成为对象的方法。
// 定义一个函数用作对象的方法 function addPrice(amount) { this.price = amount; } function book(title, author) { this.title = title; this.author = author; this.addPrice = addPrice; // 添加方法 } var myBook = new book("Perl", "Larry"); myBook.addPrice(100); console.log("Book的title属性: " + myBook.title); console.log("Book的author属性: " + myBook.author); console.log("Book的price属性: " + myBook.price);
“with”关键字
with关键字被用作引用对象的属性或方法的一种简写。
被指定为with的参数的对象将成为后面的代码块中的默认对象。
对象的属性和方法可以在不指定对象名称的情况下使用。
with语法
with object的语法是这样的:
with (object) { 这里面使用object对象的属性时,可以不使用 “object.” }
with(obj)示例
// 定义一个函数作为对象的方法 function addPrice(amount) { with(this) { price = amount; } } function book(title, author) { this.title = title; this.author = author; this.price = 0; this.addPrice = addPrice; // 添加方法 } var myBook = new book("Perl", "Larry"); myBook.addPrice(100); console.log("书的标题: " + myBook.title); console.log("书的作者: " + myBook.author); console.log("书的价格: " + myBook.price);
JavaScript对象Object内置方法
Object.create()
Object.create()方法创建新对象并将其链接到现有对象。
const student = { printInfo: function () { console.log(`名字:${this.name} 年龄:${this.age}`); } }; const s1 = Object.create(student); s1.name= "bob"; s1.age= 18; s1.printInfo();
Object.entries()
Object.entries()返回对象中属性的[key,value]对组成的数组。
const student = { 1: 'bob', 2: 'Hyman', 9: 'tom' }; console.log(Object.entries(student));
输出:
["1", "bob"] ["2", "Hyman"] ["9", "tom"]
Object.keys()
Object.keys()返回对象中属性的键的数组
let student = { name: 'Steve', age : 23 } ; console.log(Object.keys(student));
输出:
["name", "age"]
Object.values()
Object.values() 返回对象自身属性值的数组。
var chars = {1:'x', 2:'y', 3:'z'}; console.log(Object.values(chars));
输出:
["x", "y", "z"]
JavaScript原生对象
JavaScript有几个内置或原生对象。
这些对象在程序中的任何地方都可以访问,并且在不同操作系统,不同的浏览器中都可以以同样的方式工作。
下面列出了JavaScript原生对象
Number 对象
Boolean 对象
String 对象
Array 对象
Date 对象
Math 对象
RegExp 对象