选择JavaScript数组中的最后一个元素[重复]

2020/09/23 17:41 · javascript ·  · 0评论

我正在制作一个可实时更新用户的位置和路径并将其显示在Google Map上的应用程序。我具有允许使用一个对象(同时每秒更新一次)同时跟踪多个用户的功能。

现在,当用户按下Android应用程序中的按钮时,坐标将发送到数据库,并且每次位置更改时,都会在地图上更新标记(并形成折线)。

由于我有多个用户,因此我发送一个唯一且随机生成的字母数字字符串,以便为每个用户显示一个单独的路径。当JS从数据库中提取此数据时,它将检查用户是否存在,如果不存在,则会创建一个新的键,其值为列表。它看起来像这样:

loc = {f096012e-2497-485d-8adb-7ec0b9352c52: [new google.maps.LatLng(39, -86),
                                              new google.maps.LatLng(38, -87),
                                              new google.maps.LatLng(37, -88)],
       44ed0662-1a9e-4c0e-9920-106258dcc3e7: [new google.maps.LatLng(40, -83),
                                              new google.maps.LatLng(41, -82),
                                              new google.maps.LatLng(42, -81)]}

我正在做的是存储一个坐标列表作为键的值,即用户的ID。每次更改位置时,我的程序都会通过添加到列表中来不断更新此列表(这可以正常工作)。

我需要做的是每次位置更改时都更新标记的位置。我想通过选择数组中的最后一个项目来做到这一点,因为那将是最后一个已知的位置。现在,每次更改位置时,都会向地图添加一个新的标记(示例中的每个点都会在该位置显示一个标记),因此继续添加标记。

每当位置更新时,我都会使用“ for(x in loc)”语句,以从列表中获取最后一个位置,并使用该语句来更新标记。如何从哈希中的数组中选择最后一个元素?

如何访问数组的最后一个元素

看起来像这样:

var my_array = /* some array here */;
var last_element = my_array[my_array.length - 1];

您的情况如下所示:

var array1 = loc['f096012e-2497-485d-8adb-7ec0b9352c52'];
var last_element = array1[array1.length - 1];

或者,如果版本较长,则不创建新变量:

loc['f096012e-2497-485d-8adb-7ec0b9352c52'][loc['f096012e-2497-485d-8adb-7ec0b9352c52'].length - 1];

如何添加使其更简单的方法

如果您热衷于创建函数/快捷方式来完成此类任务,请使用以下代码:

if (!Array.prototype.last){
    Array.prototype.last = function(){
        return this[this.length - 1];
    };
};

last()在您的情况下,将允许您通过调用数组的方法来获取数组的最后一个元素

loc['f096012e-2497-485d-8adb-7ec0b9352c52'].last();

您可以在此处检查其是否有效:http : //jsfiddle.net/D4NRN/

使用slice()方法:

my_array.slice(-1)[0]

您也可以.pop关闭最后一个元素。请注意,这将更改array的值,但是对您来说可能没问题。

var a = [1,2,3];
a.pop(); // 3
a // [1,2]

将ES6解构数组与散布运算符一起使用

var last = [...yourArray].pop();

请注意,yourArray不会改变。

var arr = [1, 2, 3];
arr.slice(-1).pop(); // return 3 and arr = [1, 2, 3]

如果数组为空,则将返回undefined,并且不会更改数组的值。

var last = array.slice(-1)[0];

我发现-1处的slice对于获取最后一个元素(尤其是长度未知的数组)很有用,并且其性能比计算小于1的长度要好得多。

Mozilla Docs on Slice

选择最后一个数组元素的各种方法的性能

下划线Lodash_.last(Array)方法,即返回数组中的最后一个元素。他们都差不多工作

_.last([5, 4, 3, 2, 1]);
=> 1

Ramda也有一个_.last功能

R.last(['fi', 'fo', 'fum']); //=> 'fum'

您可以定义Array.prototype

if (!Array.prototype.hasOwnProperty("last")) {
  Object.defineProperty(Array.prototype, "last", {
    get() {
      return this[this.length - 1];
    }
  });
}

console.log([9, 8, 7, 6].last); // => 6

如您所见,访问看起来不像是一个函数调用。getter函数在内部被调用。

如果这对您的应用程序至关重要,请使用JavaScript对象。您不应该使用原始基元来管理应用程序的关键部分。由于这似乎是应用程序的核心,因此应改为使用对象。我在下面编写了一些代码来帮助您入门。该方法lastLocation将返回最后一个位置。


function User(id) {
    this.id = id;

    this.locations = [];

    this.getId = function() {
        return this.id;
    };

    this.addLocation = function(latitude, longitude) {
        this.locations[this.locations.length] = new google.maps.LatLng(latitude, longitude);
    };

    this.lastLocation = function() {
        return this.locations[this.locations.length - 1];
    };

    this.removeLastLocation = function() {
        return this.locations.pop();
    };

}

function Users() {
    this.users = {};

    this.generateId = function() {
        return Math.random();
    };

    this.createUser = function() {
        var id = this.generateId();
        this.users[id] = new User(id);
        return this.users[id];
    };

    this.getUser = function(id) {
        return this.users[id];
    };

    this.removeUser = function(id) {
        var user = this.getUser(id);
        delete this.users[id];

        return user;
    };

}


var users = new Users();

var user = users.createUser();

user.addLocation(0, 0);
user.addLocation(0, 1);

如果您使用的是ES6,则可以执行以下操作:

const arr = [ 1, 2, 3 ];
[ ...arr ].pop(); // 3
arr; // [ 1, 2, 3 ] (wasn't changed)

这工作:

array.reverse()[0]

因此,很多人都在使用pop()进行回答,但大多数人似乎并未意识到这是一种破坏性方法。

var a = [1,2,3]
a.pop()
//3
//a is now [1,2]

因此,对于一种真正愚蠢的,非破坏性的方法:

var a = [1,2,3]
a[a.push(a.pop())-1]
//3

像90年代那样的流行音乐:)

push将一个值附加到数组的末尾,并返回结果的长度。所以

d=[]
d.push('life') 
//=> 1
d 
//=>['life']

pop返回数组最后一项的值,然后在该索引处删除该值。所以

c = [1,2,1]
c.pop() 
//=> 1
c 
//=> [1,2]

数组的索引为0,所以c.length => 3,c [c.length] =>未定义(因为如果这样做,您正在寻找第4个值(此深度级别适用于到此为止的所有不幸的newb) ))。

对于您的应用程序来说,可能不是最好的,甚至不是很好的方法,它可能带来流量,搅动,等等。但是为了遍历一个数组,将其流式传输到另一个数组上,只是由于效率低下的方法而变得愚蠢。完全是这样。

var last = function( obj, key ) { 
    var a = obj[key];
    return a[a.length - 1];
};

last(loc, 'f096012e-2497-485d-8adb-7ec0b9352c52');
本文地址:http://javascript.askforanswer.com/xuanzejavascriptshuzuzhongdezuihouyigeyuansuzhongfu.html
文章标签: ,   ,   ,  
版权声明:本文为原创文章,版权归 javascript 所有,欢迎分享本文,转载请保留出处!

文件下载

老薛主机终身7折优惠码boke112

上一篇:
下一篇:

评论已关闭!