IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> JavaScript对象 -> 正文阅读

[JavaScript知识库]JavaScript对象


1.?JS 对象

JS 对象是什么?

JS 对象就是一系列属性的集合,一个属性包含一个名和一个值。一个属性的值可以是函数,这种情况下属性也被称为方法。

JS 对象数据类型

在 JS 中,对象的类型是引用类型

JS 对象的访问

不同于C++等其它语言,JS 对象全是 public


2.?JS 对象的声明方法

这里介绍四种基础的声明方法:

//通过字面量形式声明对象
let obj = {
    name: 'milk',
    getName: function() {
        return this.name;
    }
}

// 通过 new 操作符声明对象
let obj = new Object();
obj.name =  "milk";

// 通过函数声明的方式声明对象
function creatObj(nameVal) {
    this.name = nameVal;
}
let obj = new createObj("milk");
 
/*
原型方式声明对象:
	原型方式是将该对象的属性/方法写在他的prototype属性所指的对象上。
	(每一个函数或者说对象都有一个prototype属性,这个属性以对象的形式存在)
*/
function drinking() {};
drinking.prototype.name = "milk";
drinking.prototype.pride = 8;

let obj = new drinking();
console.log(obj.name);	// milk

3.?JS 对象中的this

在对象方法中, this 指向调用它所在方法的对象。
举个例子:

let person = {
    fname: '序员',
    lname: '程',
    fullname: function() {
        return this.lname + this.fname;
    }
}

let get_full_name = person.fullname();

console.log(person.fullname()); // 程序员
console.log(get_full_name);     // 程序员

4.?一些常用的操作方法

4.1) Object.keys(obj), Object.getOwnPropertyNames(obj)

let drinking = {
    name : "milk"
};

// 给一个不可枚举属性 pride
Object.defineProperty(drinking, "pride", {
    value : 8,
    enumerable : false
});

// 获取可枚举的属性键
console.log(Object.keys(drinking)); // ['name']

// 获取所有的属性键
console.log(Object.getOwnPropertyNames(drinking)); // ['name', 'pride']

4.2) Object.values(obj)

// 获取可枚举对象的属性值
let drinking = {
    name : "milk",
    pride : 8
}

console.log(Object.values(drinking)); // ['milk', 8]

4.3) Object.entries(obj), Object.fromEntries()

let drinking1 = {
    name : "milk",
    pride : 8
}

// 获取可枚举对象的键值对,返回它们组成的数组
console.log(Object.entries(drinking1)); //[['name', 'milk'], ['pride', 8]]

// Object.fromEntries() 把键值对列表转换为对象
let arr = [['name', 'milk'], ['pride', 8]];
let drinking2 = Object.fromEntries(arr);
console.log(drinking2); // {name: 'milk', pride: 8}

4.4) Object.assign()

// 将一个或多个对象的属性复制给目标对象,是浅拷贝

let drinking1 = {
    name1 : "milk",
    pride1 : 8
};

let drinking2 = {
    name2 : "tea",
    pride2 : 12
};

let drinking = Object.assign(drinking1, drinking2);
console.log(drinking); // {name1: 'milk', pride1: 8, name2: 'tea', pride2: 12}

4.5) 扩展运算符

// ... 可以用来创建对象,是一个浅拷贝
let drinking1 = {
    name1 : "milk",
    pride1 : 8
};

let drinking2 = {
    name2 : "tea",
    pride2 : 12
};

let drinking = {...drinking1, ...drinking2};
console.log(drinking);  // {name1: 'milk', pride1: 8, name2: 'tea', pride2: 12}

4.6) 删除对象属性

let drinking = {
    name : "milk",
    pride : 8
};

delete drinking.pride;
console.log(drinking); // {name: 'milk'}

4.7) for…in遍历对象

// 遍历对象可枚举属性
let drinking = {
    name : "milk",
    pride : 8
};

for (i in drinking) {
    console.log(i);
}

在这里插入图片描述

4.8) hasOwnProperty 检测属性

// 检测对象自身是否包含指定的属性
// 不检测原型链上继承的属性,即可以用来避免for...in遍历继承来的属性

let drinking = {
    name : "milk",
    pride : 8
};

console.log(drinking.hasOwnProperty('name')); // true
console.log(drinking.hasOwnProperty('weight')); // false
  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2021-10-11 17:25:59  更:2021-10-11 17:26:14 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/23 22:58:32-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码