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知识库 -> js 对象 -> 正文阅读

[JavaScript知识库]js 对象

1. 什么是对象

在JavaScript中,对象是一组无序的相关属性和方法的集合,所有的事物都是对象,例如字符串、数值、数组、函数等。
对象是由属性和方法组成的。

  • 属性:事物的特征,在对象中用属性来表示(常用名词)
  • 方法:事物的行为,在对象中用方法来表示(常用名词)

2. 为什么需要对象

保存一个值时,可以使用变量,保存多个值时,可以使用数组。如果要保存一个人的完整信息呢?
例如用数组保存

var arr = ['张三','男',128,154];

JS中的对象表达结构更清晰,更强大。

person.name = '张三';
person.sex = '男';
person.age = 128;
person.height = 154;

3. 创建对象的三种方式

(1)利用字面量创建对象
对象字面量:就是花括号{ }里面包含了表达这个具体事物(对象)的属性和方法。
{ }里面采取键值对的形式表示

  • 键:相当于属性名
  • 值:相当于属性值,可以是任意类型的值(数字类型、字符串类型、布尔类型、函数类型等)
var star = {
    name : 'fg',
    age : 18,
    sex : '男';
    sayHi : function() {
        alert('大家好');
    }
};

对象的调用

  • 对象里面的属性调用:对象.属性名
  • 对象里面属性的另一种调用方式:对象[ ‘属性名’ ]
  • 对象里面的方法调用:对象.方法名(),注意这个方法名字后面一定加括号
console.log(star.name); //调用名字属性
console.log(star['name']); //调用名字属性
star.sayHi();  //调用sayHi方法

(2)利用new Object创建对象

var obj = new Object(); //创建了一个空对象
obj.uname = '张三';
obj.age = 18;
obj.sex = '男';
obj.sayHi = function() {
        console.log('hi');
    }
    //(1)我们是利用 等号 = 赋值的方法 添加对象的属性和方法
    //(2)每个属性和方法之间用分号结束
    console.log(obj.uname);
    console.log(obj['sex']);
    obj.sayHi();

(3)利用构造函数创建对象
前面两种方式一次只能创建一个对象,构造函数可以多个。

//new 构造函数名();
function Star(uname, age, sex) {
    this.name = uname;
    this.age = age;
    this.sex = sex;
    this.sing = function(sang) {
        console.log(sang);
    }
}
var ldh = new Star('刘德华', 18, '男');  //调用函数返回的是一个对象
console.log(ldh.name);
console.log(ldh['sex']);
ldh.sing('冰雨');
var zxy = new Star('张学友', 19, '男');
console.log(zxy.name);
console.log(zxy.age);
zxy.sing('李香兰');

//1. 构造函数名字首字母要大写
//2. 我们构造函数不需要return 就可以返回结果
//3. 我们调用构造函数 必须使用new
//4. 我们只要new Star() 调用函数就创建一个对象 ldh {}
//5. 我们的属性和方法前面必须添加this

在这里插入图片描述

4. 构造函数和对象

  • 构造函数,如Stars(),抽象了对象的公共部分,封装到了函数里面,它泛指某一大类(class)
  • 创建对象,如new Stars(),特指某一个,通过new关键字创建对象的过程我们也称为对象实例化

5. new关键字

new在执行时会

  • 在内存中创建一个新的空对象。
  • 让this指向这个新的对象。
  • 执行构造函数里面的代码,给这个新对象添加属性和方法。
  • 返回这个新对象(所以构造函数里面不需要return)。

6. 遍历对象属性

用 for…in 语句用于对数组或者对象的属性进行循环操作

//遍历对象
var obj = {
        name: 'fg',
        age: 18,
        sex: '男'
    }
    //for (变量 in 对象) {}
    for (var k in obj) {
        console.log(k);  //k是变量 输出得到是属性名
        console.log(obj[k]);  //obj[k] 得到的是属性值
}

我们常用k或key当作变量

  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2021-12-07 11:56:25  更:2021-12-07 11:57:13 
 
开发: 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/24 7:50:59-

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