JavaScript对象详解(六)

这篇具有很好参考价值的文章主要介绍了JavaScript对象详解(六)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

JavaScript对象是存储 键值对 的集合,表示属性和值的映射关系,这与Java中的HashMap很相似。JavaScript中所有对象都是由 Object 类派生的。

1、对象的使用

1.1、使用对象字面量法
// 一、通过对象字面量法来创建对象,键为字符串(如果不是字符串,底层也会自动转成字符串),
// 值可以为任何数据类型,未赋值的属性的值为undefined
let obj2 = {};  
let obj3 = {
    name: "Carrot",
    _for: "Max",//'for' 是保留字之一,使用'_for'代替
    details: {
        color: "orange",
        size: 12
    }
}
// 3、可以使用链式访问方式来访问属性
obj3.details.color; // orange
obj3["details"]["size"]; // 12
// 4、对象的销毁,给对象赋值null即可
obj3 = null;
// 5、动态添加属性和方法
//添加属性:
let obj4 = {};
obj4.name = "李太白";
obj4.age = 18;
//添加方法:
obj4.sex = function(){
	//方法代码
};
//访问方法:
obj4.sex; //或 obj4.sex();
/* 注意:
1. 属性名及方法名如果与对象原有的属性或方法同名,会重写属性的内容和方法的功能!
2. 方法是作为属性来存储的函数。
3. 不要把字符串、数值和布尔值声明为对象!(会增加代码的复杂性并降低执行速度)
*/
// 6、删除属性和方法,还能删除不是用var修饰的变量!
delete obj4.name;
delete obj4.sex;
let nb = 3;
delete nb;
// 7、遍历对象的属性
for(let key in 对象名){
	//使用:对象名[key]来获得对象中相应属性的值;
}
1.2、使用构造函数
// 二、通过构造函数来创建对象
function Person(name, age) { // 这是构造函数(也称为对象原型), You是对象实例
  // 使用 this 将传入函数的值赋给对象的属性
  this.name = name;
  this.age = age;
}
// new一个person对象,用You接收
let You = new Person('You', 24);
// 点表示法操作属性
You.name = 'Simon';
let name = You.name;
// 括号表示法操作属性
You['name'] = 'Simon';
let name = You['name'];
// 括号表示法可以被用来访问以预留关键字作为名称的属性的值,但是不会被编辑器优化
obj.for = 'Simon'; // 语法错误,因为 for 是一个预留关键字
obj["for"] = 'Simon'; // 工作正常
// 可以使用变量定义键
let user = prompt('what is your key?');
obj[user] = prompt('what is its value?');
1.3、使用 Object.create()
// 封装动物的属性和方法
var Animal = {
  type: "Invertebrates", // 属性默认值
  displayType : function() {  // 用于显示 type 属性的方法
    console.log(this.type);
  },
  myOtherMethod(params) { // 方法也能这样写
    // ...做其他事情
  }
}

// 创建一种新的动物——animal1
var animal1 = Object.create(Animal);
animal1.displayType(); // Output:Invertebrates

// 创建一种新的动物——Fishes
var fish = Object.create(Animal);
fish.type = "Fishes";
fish.displayType(); // Output:Fishes

2、继承与原型链

所有的 JavaScript 对象至少继承于一个对象,被继承的对象称作原型,并且继承的属性可通过 prototype 对象找到。
 
JavaScript 中每个实例对象(object)都有一个私有属性(称之为 __proto__)指向它的构造函数的原型对象(prototype)。该原型对象也有一个自己的原型对象(__proto__),层层向上直到一个对象的原型对象为 null。根据定义,null 没有原型,并作为这个 原型链 中的最后一个环节。
 
几乎所有 JavaScript 中的对象都是位于原型链顶端的 Object 的实例。

2.1、基于原型链的继承
2.1.1、继承属性
// 让我们从一个函数里创建一个对象 o,它自身拥有属性 a 和 b:
let f = function () {
   this.a = 1;
   this.b = 2;
}
/* 这么写也一样
function f() {
  this.a = 1;
  this.b = 2;
}
*/
let o = new f(); // {a: 1, b: 2}

// 在 f 函数的原型上定义属性
f.prototype.b = 3;
f.prototype.c = 4;

// 不要在 f 函数的原型上直接定义 f.prototype = {b:3,c:4};这样会直接打破原型链
// o.[[Prototype]] 有属性 b 和 c (其实就是 o.__proto__ 或者 o.constructor.prototype)
// o.[[Prototype]].[[Prototype]] 是 Object.prototype.
// 最后 o.[[Prototype]].[[Prototype]].[[Prototype]] 是 null
// 这就是原型链的末尾,即 null,根据定义,null 就是没有 [[Prototype]]。

// 综上所述,整个原型链如下:
// {a:1, b:2} ---> {b:3, c:4} ---> Object.prototype---> null

console.log(o.a); // 1
// a 是 o 的自身属性吗?是的,该属性的值为 1

console.log(o.b); // 2
// b 是 o 的自身属性吗?是的,该属性的值为 2
// 原型上也有一个'b'属性,但是它不会被访问到。
// 这种情况被称为"属性遮蔽 (property shadowing)"

console.log(o.c); // 4
// c 是 o 的自身属性吗?不是,那看看它的原型上有没有
// c 是 o.[[Prototype]] 的属性吗?是的,该属性的值为 4

console.log(o.d); // undefined
// d 是 o 的自身属性吗?不是,那看看它的原型上有没有
// d 是 o.[[Prototype]] 的属性吗?不是,那看看它的原型上有没有
// o.[[Prototype]].[[Prototype]] 为 null,停止搜索
// 找不到 d 属性,返回 undefined
2.1.2、继承方法
// 当继承的函数被调用时,this 指向的是当前继承的对象,而不是继承的函数所在的原型对象。
var o = {
  a: 2,
  m: function(){
    return this.a + 1;
  }
};

console.log(o.m()); // 3  ,当调用 o.m 时,'this' 指向了 o

var p = Object.create(o); // p 是一个继承自 o 的对象

p.a = 4; // 创建 p 的自身属性 'a'
console.log(p.m()); // 5
// 调用 p.m 时,'this' 指向了 p
// 又因为 p 继承了 o 的 m 函数
// 所以,此时的 'this.a' 即 p.a,就是 p 的自身属性 'a'
2.2、不同方式所生成的原型链
2.2.1、使用语法结构
var o = {a: 1};
// o 这个对象继承了 Object.prototype 上面的所有属性
// o 自身没有名为 hasOwnProperty 的属性,hasOwnProperty 是 Object.prototype 的属性
// 因此 o 继承了 Object.prototype 的 hasOwnProperty, Object.prototype 的原型为 null
// 原型链如下:
// o ---> Object.prototype ---> null

var a = ["yo", "whadup", "?"];
// 数组都继承于 Array.prototype ,(Array.prototype 中包含 indexOf, forEach 等方法)
// 原型链如下:
// a ---> Array.prototype ---> Object.prototype ---> null

function f(){
  return 2;
}
// 函数都继承于 Function.prototype ,(Function.prototype 中包含 call, bind 等方法)
// 原型链如下:
// f ---> Function.prototype ---> Object.prototype ---> null
2.2.2、使用构造器
function Graph() {
  this.vertices = [];
  this.edges = [];
}

Graph.prototype = {
  addVertex: function(v){
    this.vertices.push(v);
  }
};

var g = new Graph();
// g 是生成的对象,他的自身属性有 'vertices' 和 'edges'。
// 在 g 被实例化时,g.[[Prototype]] 指向了 Graph.prototype。
2.2.3、使用Object.create()
var a = {a: 1};
// a ---> Object.prototype ---> null

// ES5新增的方法,可以调用这个方法来创建一个新对象。新对象的原型就是调用 create 方法时传入的第一个参数:
var b = Object.create(a);
// b ---> a ---> Object.prototype ---> null
console.log(b.a); // 1 (继承而来)

var c = Object.create(b);
// c ---> b ---> a ---> Object.prototype ---> null

var d = Object.create(null);
// d ---> null
console.log(d.hasOwnProperty); // undefined,因为 d 没有继承 Object.prototype
2.2.4、使用 class 关键字
// class是ES6新增的关键字(class, constructor,static,extends,super),它仍然是基于原型的
class Polygon {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }
}

class Square extends Polygon {
  constructor(sideLength) {
    super(sideLength, sideLength);
  }
  get area() {
    return this.height * this.width;
  }
  set sideLength(newLength) {
    this.height = newLength;
    this.width = newLength;
  }
}

var square = new Square(2);
2.3、实现继承的6种方式
2.3.1、原型链继承
function Parent1() { // 父类
  this.name = 'parent1';
  this.play = [1, 2, 3];
}
function Child1() { // 子类
  this.type = 'child1';
}
// 将子类Child1原型指向父类Parent1
Child1.prototype = new Parent1(); 
// 此时Child1可以访问父类的属性,但是对于多个子类来说,父类的属性与方法是共享的!
let child1 = new Child1();
2.3.2、构造函数继承
function Parent1() { // 父类
  this.name = 'parent1';
}
Parent1.prototype.getName = function () { // 给父类原型添加属性
  return this.name;
}
function Child1() {
  // call()用于调用父类构造函数,this后面可跟属性列表;
  // 这种方式只能继承父类的实例属性和方法,不能继承父类的原型属性或者方法。
  Parent1.call(this);
  this.type = 'child1';
}
let child = new Child1();
// 正常运行
console.log(child);
// 运行报错,因为child没有getName方法
console.log(child.getName());
2.3.3、组合继承(原型链+构造函数)
// 这种方式会导致多调用一次构造函数,性能开销会变大
function Parent3() { // 父类
  this.name = 'parent3';
  this.play = [1, 2, 3];
}
Parent3.prototype.getName = function () { // 给父类原型添加属性
  return this.name;
}
function Child3() {
  // 第二次调用父类构造函数
  Parent3.call(this);
  this.type = 'child3';
}
// 第一次调用父类构造函数
Child3.prototype = new Parent3();
// 手动挂上构造器,指向自己的构造函数
Child3.prototype.constructor = Child3;

let c1 = new Child3();
let c2 = new Child3();
c1.play.push(4);
console.log(c1.play, c2.play); // 不互相影响
console.log(c1.getName()); // 正常输出'parent3'
console.log(c2.getName()); // 正常输出'parent3'
2.3.4、原型式继承
// 这种方式,多个实例的引用类型属性指向相同的内存,所以存在篡改的可能
let parent4 = { // 父类
  name: 'parent4',
  friends: ['p1', 'p2', 'p3'],
  getName: function () {
    return this.name
  },
}
// create方法返回一个继承parent4的对象,person的原型将指向parent4
let person = Object.create(parent4);
// 子类添加和修改属性
person.name = 'Tom';
person.friends.push('jerry');
// 定义一个用作比较的变量,并修改属性
let person2 = Object.create(parent4);
person2.friends.push('lucy');
// 测试输出
console.log(person.name); // Tom
console.log(person.name === person.getName()); // true
console.log(person2.name); // parent4
console.log(person.friends); // ['p1', 'p2', 'p3', 'jerry', 'lucy']
console.log(person2.friends); // ['p1', 'p2', 'p3', 'jerry', 'lucy']
2.3.5、寄生式继承
/*
使用原型式继承可以获得一份目标对象的浅拷贝,然后利用这个浅拷贝的能力再进行增强,添加一些方法,
这样的继承方式就叫作寄生式继承。对于普通对象的继承方式来说,寄生式继承相比于原型式继承,
在父类基础上添加了更多的方法。
*/
let parent5 = { // 父类
  name: 'parent5',
  friends: ['p1', 'p2', 'p3'],
  getName: function () {
    return this.name
  },
}
function clone(original) { // 封装一个浅拷贝函数
  let clone = Object.create(original); // 得到继承于original的对象
  clone.getFriends = function () { // 返回的是clone对象的friends属性
    return this.friends; 
  }
  return clone;
}

let person = clone(parent5); 
console.log(person.getName()); // parent5
console.log(person.getFriends()); //['p1', 'p2', 'p3']
2.3.6、寄生组合式继承
/*
结合原型式提及的继承方式,解决普通对象的继承问题,不同实例的引用类型属性不存在篡改的可能,
通过改造前几种方式,得出了寄生组合式的继承方式,这也是所有继承方式里面相对最优的继承方式
*/
function Parent6() { // 父类
  this.name = 'parent6';
  this.play = [1, 2, 3];
}
Parent6.prototype.getName = function () { // 给父类原型添加属性
  return this.name;
}
function Child6() {
  Parent6.call(this); // 继承
  this.friends = 'child5';
}
// child原型指向继承parent原型的对象,child原型的构造函数又指向child的构造函数
function clone(parent, child) {
  child.prototype = Object.create(parent.prototype);
  child.prototype.constructor = child;
}

clone(Parent6, Child6); // 进行引用转换操作

Child6.prototype.getFriends = function () { // 子类原型添加个方法
  return this.friends;
}

let person = new Child6();
console.log(person); 
console.log(person.getName() + " " + person.getFriends()); // parent6 child5
let p2 = new Child6();
p2.play.push(4);
console.log(person.play); // [1, 2, 3]
console.log(p2.play); // [1, 2, 3, 4]
2.3.7、总结

JavaScript对象详解(六)

 
构造函数继承:只能继承父类的实例属性和方法,不能继承父类的原型属性或者方法;
 
原型链继承:子类可以访问父类的属性,但是对于多个子类来说,父类的属性与方法是共享的;
 
组合继承:这种方式会导致多调用一次构造函数,性能开销会变大;
 
原型式继承:这种方式,多个实例的引用类型属性指向相同的内存,所以存在篡改的可能;
 
寄生式继承:相比原型式继承,在父类基础上添加了更多方法;
 
寄生组合式继承:结合前几种方式的优缺点,解决了普通对象的继承问题,和原型式的篡改问题。


3、包装类

名称 描述
Number() 数字的包装类
String() 字符串的包装类
Boolean() 布尔值的包装类

4、Math 对象的常用方法

方法名称 描述
Math.round() 可以将一个数字四舍五入为整数
Math.max() 取一组数中的最大值
Math.min() 取一组数中的最小值
Math.random() 0-1 之间的随机数(包含 0,不包含 1)

5、Date 对象的常用方法

方法名称 描述
new Date() 当前时间的日期对象
getDate() 返回一个月中的某一天 (1 ~ 31)
getDay() 返回一周中的某一天 (0 ~ 6)
getMonth() 返回月份 (0 ~ 11)
getFullYear() 返回年份
getHours() 返回小时 (0 ~ 23)
getMinutes() 返回分钟数(0-59)
getSeconds() 返回秒数(0-59)
getTime() 将日期对象变为时间戳(返回 1970 年 1 月 1 日至今的毫秒数)
parse() 将日期对象变为时间戳(返回 1970 年 1 月 1 日至今的毫秒数),最后三位是 000

6、正则表达式

正则表达式是用于匹配字符串中字符组合的模式。在 JavaScript 中,正则表达式也是对象。这些模式被用于 RegExpexectest 方法,以及 StringmatchmatchAllreplacesearchsplit 方法。
 
官方教程:Regular_Expressions

6.1、创建正则表达式
var patt=/pattern/attributes;
//或调用RegExp的构造函数
var patt=new RegExp(pattern,attributes);
/*
- pattern:是一个字符串,指定了正则表达式的模式或其他正则表达式。
- attributes:是一个可选的字符串,包含属性 "g"、"i" 和 "m",分别用于指定全局匹配、区分大小写的匹配和多行匹配。
*/
//当使用构造函数创造正则对象时,需要常规的字符转义规则(在前面加反斜杠 \)
var re = new RegExp("\\w+");
var re = /\w+/;
6.2、常用方法
方法 描述
exec 一个在字符串中执行查找匹配的 RegExp 方法,它返回一个数组(未匹配到则返回 null)。
test 一个在字符串中测试是否匹配的 RegExp 方法,它返回 true 或 false。
match 一个在字符串中执行查找匹配的 String 方法,它返回一个数组,在未匹配到时会返回 null。
matchAll 一个在字符串中执行查找所有匹配的 String 方法,它返回一个迭代器(iterator)。
search 一个在字符串中测试匹配的 String 方法,它返回匹配到的位置索引,或者在失败时返回 -1。
replace 一个在字符串中执行查找匹配的 String 方法,并且使用替换字符串替换掉匹配到的子字符串。
split 一个使用正则表达式或者一个固定字符串分隔一个字符串,并将分隔后的子字符串存储到数组中的 String 方法。
6.3、使用案例
var myArray = /d(b+)d/g.exec("cdbbdbsbz");
// 和 "cdbbdbsbz".match(/d(b+)d/g); 相似。
// 但是 "cdbbdbsbz".match(/d(b+)d/g) 输出数组 [ "dbbd" ],
// 而 /d(b+)d/g.exec('cdbbdbsbz') 输出数组 [ "dbbd", "bb", index: 1, input: "cdbbdbsbz" ].

var myRe = new RegExp("d(b+)d", "g");
var myArray = myRe.exec("cdbbdbsbz");

var myRe2 = /d(b+)d/g;
var myArray2 = myRe.exec("cdbbdbsbz"); //这样也ok

console.log(myRe2.lastIndex); // 5
console.log(/d(b+)d/g.lastIndex); // 0 ,这样不行哦

var re = /(\w+)\s(\w+)/;
var str = "John Smith";
var newstr = str.replace(re, "$2, $1"); // 使用子匹配替换str字符串
console.log(newstr); // Smith John
// 下面这个姓名字符串包含了多个空格和制表符,且在姓和名之间可能有多个空格和制表符。
var names = "Orange Trump ;Fred Barney; Helen Rigby ; Bill Abel ; Chris Hand ";

var output = ["---------- 原始字符串\n", names + "\n"];

// 准备两个模式的正则表达式放进数组里。分割该字符串放进数组里。
// 匹配模式:匹配一个分号及紧接其前后所有可能出现的连续的不可见符号。
var pattern = /\s*;\s*/;
// 把通过上述匹配模式分割的字符串放进一个叫做 nameList 的数组里面。
var nameList = names.split(pattern);

// 新建一个匹配模式:匹配一个或多个连续的不可见字符及其前后紧接着由
// 一个或多个连续的基本拉丁字母表中的字母、数字和下划线组成的字符串
// 用一对圆括号来捕获该模式中的一部分匹配结果。捕获的结果稍后会用到。
pattern = /(\w+)\s+(\w+)/;

// 新建一个数组 bySurnameList 用来临时存放正在处理的名字。
var bySurnameList = [];

// 输出 nameList 的元素并且把 nameList 里的名字
// 用逗号接空格的模式把姓和名分割开来然后存放进数组 bySurnameList 中。
//
// 下面的这个替换方法把 nameList 里的元素用 $2, $1 的模式
//(第二个捕获的匹配结果紧接着一个逗号一个空格然后紧接着第一个捕获的匹配结果)替换了
// 变量 $1 和变量 $2 是上面所捕获的匹配结果。

output.push("---------- 按正则表达式拆分后");

var i, len;
for (i = 0, len = nameList.length; i < len; i++) {
  output.push(nameList[i]);
  bySurnameList[i] = nameList[i].replace(pattern, "$2, $1");
}

// 输出新的数组
output.push("---------- 反转名称");
for (i = 0, len = bySurnameList.length; i < len; i++){
  output.push(bySurnameList[i]);
}

// 根据姓来排序,然后输出排序后的数组。
bySurnameList.sort();
output.push("---------- 排序");
for (i = 0, len = bySurnameList.length; i < len; i++){
  output.push(bySurnameList[i]);
}

output.push("---------- 结束了");
console.log(output.join("\n"));
6.4、修饰符
修饰符 描述
i 执行对大小写不敏感的匹配。
g 执行全局匹配(查找所有匹配而非在找到第一个匹配后停止)。
m 执行多行匹配。
6.5、方括号表示法

方括号用于查找某个范围内的字符

表达式 描述
[abc] 查找方括号之间的任何字符。
[^abc] 查找任何不在方括号之间的字符。
[0-9] 查找任何从 0 至 9 的数字。
[a-z] 查找任何从小写 a 到小写 z 的字符。
[A-Z] 查找任何从大写 A 到大写 Z 的字符。
[A-z] 查找任何从大写 A 到小写 z 的字符。
[adgk] 查找给定集合内的任何字符。
[^adgk] 查找给定集合外的任何字符。
(red|blue|green) 查找任何指定的选项。
6.6、元字符

元字符(Metacharacter)是拥有特殊含义的字符文章来源地址https://www.toymoban.com/news/detail-470315.html

元字符 描述
d 匹配一个数字字符
D 匹配一个非数字字符
w 匹配字母、数字或者下划线,类似于[A-Za-z0-9_]
W 匹配除字母、数字或者下划线以外的字符。等价于[^A-Za-z0-9_]
s 匹配一个空白字符(空格、制表符和换行符)
. 匹配任意一个字符
^ 匹配开头
$ 匹配结尾
6.7、量词
量词 描述
* 匹配前面的子表达式零次或多次,等价于: {0,}
+ 匹配前面的子表达式一次或多次,等价于: {1,}
? 匹配前面的子表达式零次或一次,等价于: {0,1}
{n} n 是一个正整数,表示匹配 n 次
{n,} n 是一个正整数,表示至少匹配 n 次
{n,m} n 和 m 是一个正整数,最少匹配 n 次且最多匹配 m 次

上一篇文章 下一篇文章
JavaScript数组(五) JavaScript语句(七)

到了这里,关于JavaScript对象详解(六)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • JS如何获取对象的键名、键值

    使用Object.keys()获取对象的键名 object.keys()方法只返回对象的键名,并转换为一个数组。 使用Object.entries()获取对象的键名 object.entries()方法是从对象中获取每个键值对,并将这些键值对转换为一个数组并将它们存储在一个大数组中。此方法只接受一个参数,即对象本身。 使用

    2024年02月12日
    浏览(39)
  • js在数组对象中添加和删除键值对(对象属性)的方法

    添加 1.Object.assign():用法-Object.assign(源对象, {要添加的键值对}) 2.拓展运算符(...):用于取出参数对象所有可遍历属性然后拷贝到当前对象 3.object[key] = value:直接给新的key赋值 删除 1.将属性设置为 undefined:属性本身仍将存在于对象中,它还会改变原始对象。 2.使用 delete 操

    2024年02月14日
    浏览(50)
  • 提升Raft以加速分布式键值存储

    Raft是当前广泛使用的共识算法。流行的系统,如Kafka、Cockroach DB、MongoDB、Neo4j、Splunk等,都使用Raft来实现共识。系统要么是最终一致性的,要么是强一致性的。线性一致性是一致性模型中最强大的,但实现它可能很耗时。键值数据库出现在市场上,以避免SQL数据库的复杂性并

    2024年01月19日
    浏览(34)
  • 论文阅读笔记(Clover: 计算与存储被动分离的分布式键值存储系统)

    关于 Disaggregating Persistent Memory and Controlling Them Remotely: An Exploration of Passive Disaggregated Key-Value Stores 这篇论文的笔记 原文链接 提出背景 传统的分布式存储系统中,每个节点都会包含计算和存储两个部分,一个节点既可以访问本地的存储部分也可以访问远端的存储部分。传统的

    2024年02月07日
    浏览(56)
  • 深度解析HashMap:探秘Java中的键值存储魔法

    1.1 介绍HashMap在Java中的重要性 HashMap是Java中一个非常重要的数据结构,它属于Java集合框架的一部分,用于存储键值对。 HashMap在Java中的一些重要性: 高效的查找操作: HashMap基于哈希表实现,可以在常数时间内执行查找操作,这使得它在大数据集合中非常高效。 灵活性:

    2024年02月05日
    浏览(46)
  • 深入解析Redis:一种快速、高效的键值存储系统

    在现代应用程序中,高性能和可扩展性是至关重要的。Redis(Remote Dictionary Server)是一种快速、高效的键值存储系统,它具有出色的性能和灵活的数据结构。本文将深入解析Redis的特点、安装配置、基本操作、高级功能、性能优化、应用场景、注意事项和最佳实践。 1.1 介绍

    2024年02月16日
    浏览(36)
  • Vue 循环map对象拿到key值和value值,VUE 获取对象{}的key值,vue根据对象id删除数组中的对象,实现局部刷新的功能,vue中JS 对象动态添加键值对 vue中JS 对象动态添加键值对

    适用场景: vue中定义的map对象 map : { name : \\\'xxx\\\' } 接口回显map格式的数据 data :{ key : value} 都可以通过以下方式拿到key和value的值 VUE 获取对象{}的key值  vue根据对象id删除数组中的对象,实现局部刷新的功能 方法一:使用过滤器 注:这个一般是根据对象id 方法二:使用splice() 注

    2024年02月16日
    浏览(52)
  • “探索Redis:高性能键值存储数据库的实用指南“

    标题:探索Redis:高性能键值存储数据库的实用指南 引言: Redis是一种高性能的键值存储数据库,它通过将数据存储在内存中,提供了快速的读写操作。本文将介绍Redis的基本概念和常用功能,并提供示例代码帮助读者更好地理解和应用Redis。 Redis的基本概念 Redis是一个开源的

    2024年02月15日
    浏览(72)
  • 阿里云对象存储oss-文件上传过程详解(两种方式)

    问题:需要配置系统变量才能够使用 以win11为例 (1)打开设置 (2)选择----系统信息 (3)选择----高级系统设置 (4)选择----环境变量 (5)选择----系统变量这栏-----新建 (6)在“变量名”输入框中输入 OSS_ACCESS_KEY_ID,在“变量值”输入框中输入你的Access Key ID。再次点击“新建”按钮,输入

    2024年02月10日
    浏览(41)
  • 高级编程JavaScript中的Map键值对你知道吗?一篇文章看懂

    Map 保存键值对,其中键可以是任何数据类型。 Map 会记住键的原始插入顺序。 Map 提供表示映射大小的属性。 方法 描述 new Map() 创建新的 Map 对象。 set() 为 Map 中的键设置值。 get() 获取 Map 对象中键的值。 clear() 从 Map 中移除所有元素。 delete() 删除由某个键指定的 Map 元素。

    2024年01月25日
    浏览(46)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包