ES6基础语法之对象用法

2024-12-01 09:31:43

一、对象和属性和方法

JavaScript中对象：

var person={name:"Jack",age:20};

或：

var name = "jack";
var age = 20;
var person = {name:name,age:age};
console.log(person.age); //20

ES6中的简洁表示：

let [name,age]=["jack",20];
let person = {name,age}; //等同person = {name: name,age: age}
console.log(person.age); //20

JavaScript中对象方法：

var person = {
    SayHi:function()
    {
    	console.log("hi");
    }
}
person.SayHi();  //hi

ES6中简洁表示：

let person = {
    SayHi()
    {
    	console.log("hi");
    }
}
person.SayHi();

ES6允许用表达式作为属性名，但是一定要将表达式放在方括号内：

var person = {["na"+"me"]:"jack",["a"+"ge"]:20};
console.log(person.age);

或

let str = "Hi";
let person = {
    ["Say"+str](){
    	console.log("hi");
    }
}
person.SayHi();

注意点：属性的简洁表示法和属性名表达式不能同时使用，否则会报错：

let [name,age]=["jack",20];
let person = {["na"+"me"],["a"+"ge"]}; //报错

二、对象的扩展运算符...

取出参数对象所有可遍历属性然后拷贝到当前对象：

let stu1 = {name:"Jack",age:20,sex:"男"};
let stu2 = {...stu1};
console.log(stu2); //{name: "Jack", age: 20,sex:"男"}

合并两个对象：

let stu1BasicInfo = {name:"Jack",age:20,sex:"男"};
let stu1DetailInfo = {phone:"13524521457",mail:"ldh@163.com"};
let stu = {...stu1BasicInfo,...stu1DetailInfo};
console.log(stu);
//{name:"Jack",age:20,sex:"男",phone:"13524521457",mail:"ldh@163.com"}

拷贝对象时支持添加属性：

let stu1 = {name:"Jack",age:20,sex:"男"};
let stu2 = {...stu1,phone:"13554785452"};
console.log(stu2); //{name:"Jack",age:20,sex:"男",phone:"13554785452"}

添加的属性在拓展运算符后面，取添加的属性：

let stu1 = {name:"Jack",age:20,sex:"男"};
let stu2 = {...stu1,name:"rose",phone:"13554785452"};
console.log(stu2);
//{name:"rose",age:20,sex:"男",phone:"13554785452"}

添加的属性在拓展运算度前面，取扩展运算符内容：

let stu1 = {name:"Jack",age:20,sex:"男"};
let stu2 = {name:"rose",phone:"13554785452",...stu1};
console.log(stu2);
//{name:"Jack",phone:"13554785452"，age:20,sex:"男"}

到此这篇关于ES6基础语法之对象的文章就介绍到这了。希望对大家的学习有所帮助，也希望大家多多支持我们。

ES6基础语法之Map和Set对象

一.Map对象 Map 对象保存键值对.任何值(对象或者原始值) 都可以作为一个键或一个值. Map中的键值是有序的. let myMap = new Map(); myMap.set("23","乔丹"); myMap.set("33","皮蓬"); let name = myMap.get("33"); console.log(name); //皮蓬 let has = myMap.has("
ES6的循环与可迭代对象示例详解

本文将研究 ES6 的 for ... of 循环. 旧方法在过去,有两种方法可以遍历 javascript. 首先是经典的 for i 循环,它使你可以遍历数组或可索引的且有 length 属性的任何对象. for(i=0;i<things.length;i++) { var thing = things[i] /* ... */ } 其次是 for ... in 循环,用于循环一个对象的键/值对. for(key in things) { if(!thing.hasOwnProperty(
ES6基础之数组和对象的拓展实例详解

本文实例讲述了ES6基础之数组和对象的拓展.分享给大家供大家参考,具体如下: 数组的扩展 1.拓展运算符('...'),它相当于rest参数的逆运算,用于将一个数组转换为用逗号分隔的参数序列: console.log(...[1, 2, 3]) // 1 2 3 console.log(1, ...[2, 3, 4], 5) // 1 2 3 4 5 2.如果扩展运算符后面是一个空数组,则不产生任何效果: [...[], 1] // [1] 3.常见的拓展运算符的应用: //合并数组 let a
ES6中定义类和对象的方法示例

本文实例讲述了ES6中定义类和对象的方法.分享给大家供大家参考,具体如下: 类的基本定义和生成实例: // 类的基本定义和生成实例 class Parent{ //定义一个类 constructor(name='xiaxaioxian'){ this.name= name; } } // 生成一个实例 let g_parent = new Parent(); console.log(g_parent); //{name: "xiaxaioxian"} let v_parent = ne
ES6中异步对象Promise用法详解

本文实例讲述了ES6中异步对象Promise用法.分享给大家供大家参考,具体如下: 回忆一下ES5中的怎么使用异步方法 // es5中的异步回调 let ajax = function(callback){ console.log('执行') // 执行 setTimeout(() => { callback&&callback.call(); }, 1000) }; ajax(function(){ console.log('hello') // 1s后打印hello }); 使用
ES6 Promise对象概念及用法实例详解

本文实例讲述了ES6 Promise对象概念及用法.分享给大家供大家参考,具体如下: 参考文章:ECMAScript 6 入门一. Promise是什么 Promise是异步编程的一种解决方案,它是一个容器,里面保存着某个未来才会结束的事件的结果.它有三种状态,只有异步操作的结果才能决定当前的状态,不受外界因素的影响.而一旦状态改变,就不会再变,也就是状态凝固了(resolved),任何时候都可以得到这个结果. Promise的缺点: 1. 无法取消Promise,一旦新建它就会立即执行,无法
es6 js 匹配两个数组对象的方法

判断两个数组用的value是否相等 this.list = [ { user_type: 0, user_id: 1003, department_id: 1, department_name: "公司xx", mobile: "", realname: "廖xx", com_name: "任公司", label: "廖建平", value: 1003 }, { user_type: 0, user_id:
ES6基础之 Promise 对象用法实例详解

本文实例讲述了ES6基础之 Promise 对象用法.分享给大家供大家参考,具体如下: Promise 对象 1.Promise对象是ES6对异步编程的一种解决方案,它有以下两个特点: Promise对象代表一个异步操作,它只有三种状态:Pending(进行中).Resolved(已完成,又称 Fulfilled)和Rejected(已失败),并且该状态不会受外界的影响 Promise对象的状态改变,只有两种可能:从 Pending 变为 Resolved 或者从 Pending 变为 Reje
ES6对象操作实例详解

本文实例讲述了ES6对象操作.分享给大家供大家参考,具体如下: 1.对象赋值 es5中的对象赋值方式如下: let name="小明"; let skill= 'es6开发'; var obj= {name:name,skill:skill}; console.log(obj); 结果为: ES6允许把声明的变量直接赋值给对象,例如: let name="小明"; let skill= 'es6开发'; var obj= {name,skill}; console.
ES6基础语法之对象用法

一.对象和属性和方法 JavaScript中对象: var person={name:"Jack",age:20}; 或: var name = "jack"; var age = 20; var person = {name:name,age:age}; console.log(person.age); //20 ES6中的简洁表示: let [name,age]=["jack",20]; let person = {name,age}; //
ES6基础语法之模块化介绍

ES6 引入了模块化, ES6 的模块化分为导出(export) @与导入(import)两个模块. ES6模块化特点: (1)ES6 的模块自动开启严格模式,不管你有没有在模块头部加上 use strict;. (2) 模块中可以导入和导出各种类型的变量,如函数,对象,字符串,数字,布尔值,类等. (3) 每个模块都有自己的上下文,每一个模块内声明的变量都是局部变量,不会污染全局作用域. (4) 每一个模块只加载一次(是单例的), 若再去加载同目录下同文件,直接从内存中读取. 一.export
ES6基础语法之数组拓展

一.Array.of() 将参数中所有值作为元素形成数组: console.log(Array.of(1, 2, 3, 4)); // [1, 2, 3, 4] 参数的值可以为不同的类型: console.log(Array.of(1, '2', true)); // [1, '2', true] 参数为空时返回空数组: console.log(Array.of()); // [] 注意: let arr1 = new Array(10); //是一个长度为10的空数组 let arr2 = A
ES6基础语法之class类介绍

一.class基本语法 JavaScript 语言中,编写一个学生类,代码如下:(prototype可以个对象添加属性和方法) function Student(stuno,stuname) { this.stuno = stuno; this.stuname = stuname; } Student.prototype.stusex = ""; Student.prototype.sayHi = function() { console.log("大家好,我是"+
ES6基础语法之函数介绍

一.函数参数的扩展 ES6支持参数的默认值: function fn(name,age,sex="男") { console.log(`大家好,我是${name},性别${sex},今年${age}岁!`); } fn("刘德华",45); //大家好,我是刘德华,性别男,今年45岁! 传递undefined,取默认值: function fn(name,sex="男",age) { console.log(`大家好,我是${name},性别${
ES6基础语法之字符串扩展

一.字符串的遍历 JS中遍历字符串: var str = "hello,world"; for(var i = 0;i<str.length;i++) { console.log(str[i]); } ES6扩展的遍历字符串方法: let str = "hello,world"; for(let c of str) { console.log(c); } 二.字符串识别.重复.补全字符串识别: ES6 之前判断字符串是否包含子串,用 indexOf 方法,E
Java 基础语法让你弄懂类和对象

目录 Java 基础语法一.类与对象的初步认知二.类和类的实例化三.类的成员 1. 字段/属性/成员变量 2. 方法 3. static 关键字四.封装 1. private 实现封装 2. getter 和 setter 方法五.构造方法 1. 基本语法 2. this 关键字六.认识代码块 1. 什么是代码块 2. 本地代码块 3. 实例代码块 4. 静态代码块七.补充说明 1. toString 方法 2. 匿名对象八.总结 Java 基础语法其实在学习 C 语言时就一直

ES6基础语法之对象用法

一、对象和属性和方法

二、对象的扩展运算符...

相关推荐

随机推荐