JavaScript 对象
2023-12-15 16:38:38
1. 对象
1.1 对象基本概念
?a. 对象属性
- 对象也是变量,内部可以包含多个变量(name: value), 对象就是相当于是属性与方法的容器.
- 对象属性访问有两种方法
a. 对象.属性名 -> Object.name
b. 对象[“属性名字”] -> Object[“name”]
// 对象创建, 注意属性之间需要逗号隔开
var student = {
name: "学生A",
age: 12,
hobby: "篮球"
};
console.log(student.name + " " + student["age"] + " " + student.hobby);
?b. 对象方法
// 方法定义格式 -> objectName.methodName()调用
methodName : function() {
// 代码
}
// 方法与属性之间也依旧需要逗号相隔
var student = {
name: "学生A",
age: 12,
hobby: "篮球",
SayName: function () {
console.log(this.name);
},
SayAge: function () {
console.log(this.age);
}
};
student.SayName(); // 对象方法调用
?
1.2 对象作用域
? a. 浏览器环境当中拥有一个顶层对象window, 所有的对象都是这个顶层对象的下属对象.
var x = 1;
console.log(window.x); // window顶层对象
console.log(x); // 顶层对象window可以省略
? b. 函数内变量属于局部变量,不能在函数外进行调用,在一切规范操作下,默认是局部优先,并且不会对外部同名变量进行覆盖。若内部变量未使用var关键字会将其上升为全局变量.
function myFunction() {
var x = 2;
}
console.log(x); // 不能在函数外使用,报错
var x = 1;
function myFunction() {
var x = 2;
console.log(x); // 2 -> 局部优先原则
};
myFunction();
var x = 1;
function myFunction() {
x = 2; // 没有设立var, 该变量会上升为全局变量.
}
myFunction();
console.log(x); // 2
var x = 1;
function myFunction() {
x = 2; // 没有设立var, 该变量会上升为全局变量
}
// 编译是不会将方法内变量上升的,需要调用方法的运行才会生效覆盖
console.log(x); // 1
?
2. this引用
2.1 一般情况
- 我们知道其实最顶层对象就是默认的window对象,所以在这我们只分析window层和window环境内的对象,我们只需要认识这两层对象的关系即可,其他如果你有多层它的关系就都是类似的,类比去看就行
- 核心:在全局范围内调用的函数或者变量引用都是指向全局对象window, 在window子层对象当中使用的this也是类似的代指向该子层对象。[在哪个对象作用范围内使用其就指向谁]
- 关键: 哪个对象调用我,我就指向谁。
var x = this;
var MyFunction = function(){
return this; // 严格模式是undefined
}
console.log(x); // window对象
console.log(this.MyFunction()); // window对象
var op = {
x: 1,
MyFunction1: function(){ // 指向该对象op
return this.x;
},
MyFunction2: function(){ // 指向该对象op
return this;
},
// 特例 -> 在对象当中使用匿名函数会指向全局对象window(可能内部匿名函数初始化是window对象完成)
MyFunction3: (function(){
console.log(this);
// 不能使用 return, 会报错
})()
};
console.log(op.MyFunction1()); // 1
console.log(op.MyFunction2()); // 对象op
// op.MyFunction3(); 不能调用匿名函数, 报错
?
2.2 强制转换对象引用(call)
- call当中你放入哪个对象,就是哪个对象去使用这个方法.(显示函数绑定)
var person1 = {
fullName: function() {
return this.firstName + " " + this.lastName;
}
}
var person2 = {
firstName:"John",
lastName: "Doe",
}
var name = person1.fullName.call(person2);
console.log(name); // John Doe
文章来源:https://blog.csdn.net/weixin_51566349/article/details/135011444
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。 如若内容造成侵权/违法违规/事实不符,请联系我的编程经验分享网邮箱:veading@qq.com进行投诉反馈,一经查实,立即删除!
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。 如若内容造成侵权/违法违规/事实不符,请联系我的编程经验分享网邮箱:veading@qq.com进行投诉反馈,一经查实,立即删除!