如何获得数组的第一个元素?

2020/10/10 16:41 · javascript ·  · 0评论

如何从这样的数组中获取第一个元素:

var ary = ['first', 'second', 'third', 'fourth', 'fifth'];

我尝试了这个:

alert($(ary).first());

但是它会回来[object Object]所以我需要从数组中获取第一个元素,它应该是element 'first'

像这样

alert(ary[0])

为什么要用jQuery修饰香草JavaScript数组?使用标准JavaScript!

var ary = ['first', 'second', 'third', 'fourth', 'fifth'];
alert(ary[0]);

https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array

也,
需要更多的jQuery

资料来源,由bobince提供

以下是针对不同情况的一些方法。

在大多数情况下,访问第一个元素的最简单方法是

yourArray[0]

但这需要您检查[0]是否确实存在。

在现实世界中,您并不关心原始数组,也不想检查索引是否存在,而只想获取第一个元素或未定义的内联。

在这种情况下,可以使用shift()方法获取第一个元素,但是请谨慎使用此方法修改原始数组(删除第一项并返回它)。因此,阵列的长度减少了一个。此方法可用于仅需要获取第一个元素但不关心原始数组的内联情况。

yourArray.shift()

要知道的重要一点是,如果您的数组以[0]索引开头,则以上两项只是一个选择。

在某些情况下,第一个元素已被删除,例如,delete yourArray [0]使数组上留有“空洞”。现在[0]处的元素只是未定义,但是您想获取第一个“现有”元素。我已经在现实世界中看到了许多案例。

因此,假设我们不了解数组和第一个键(或者我们知道有孔),我们仍然可以获得第一个元素。

您可以使用find()获取第一个元素。

find()的优点是它的效率,因为当达到第一个满足条件的值时,它会退出循环(有关更多信息,请参见下文)。(您也可以自定义条件以排除null或其他空值)

var firstItem = yourArray.find(x=>x!==undefined);

我还想在此处包括filter()作为选项,以便首先“修复”副本中的数组,然后获取第一个元素,同时保持原始数组不变(未修改)。

在此处包含filter()的另一个原因是它存在于find()之前,并且许多程序员已经在使用它(这是ES5,而find()是ES6)。

var firstItem = yourArray.filter(x => typeof x!==undefined).shift();

警告filter()并不是真正有效的方法(filter()运行于所有元素)并创建另一个数组。可以在小型阵列上使用,因为对性能的影响很小,例如,更接近于使用forEach。

(我看到有些人建议使用for ... in循环来获取第一个元素,但是我建议反对使用此方法,因为... in不应用于遍历索引顺序很重要的Array,因为它不会顺便说一下,forEach不能解决很多建议的问题,因为您不能破坏它,它会贯穿所有元素,因此最好还是使用简单的for循环并通过检查键/值

find()和filter()都保证元素的顺序,因此如上所述可以安全使用。

使用ES6解构

let [first] = [1,2,3];

与...相同

let first = [1,2,3][0];

如果第一个元素已删除,则索引0的元素可能不存在:

let a = ['a', 'b', 'c'];
delete a[0];

for (let i in a) {
  console.log(i + ' ' + a[i]);
}

没有jQuery的第一个更好的方法:

function first(p) {
  for (let i in p) return p[i];
}

console.log( first(['a', 'b', 'c']) );

如果您想保持可读性,可以随时向中添加第一个函数Array.protoype

Array.prototype.first = function () {
    return this[0];
};

然后,您可以轻松检索第一个元素:

[1, 2, 3].first();
> 1

您可以使用find()

let first = array.find(Boolean);

或者如果您想要第一个元素,即使它是虚假的

let first = array.find(e => true);

加倍努力:

如果您关心可读性,但又不想依赖于数字事件,则可以通过定义它来添加first()-function Array.protoypeObject​.define​Property()从而减轻直接修改内置Array对象原型的陷阱(在此进行说明)。

性能相当不错(find()在第一个元素之后停止),但是它并不完美或无法普遍访问(仅适用于ES6)。有关更多背景信息,请阅读@Selays答案

Object.defineProperty(Array.prototype, 'first', {
  value() {
    return this.find(e => true);     // or this.find(Boolean)
  }
});

然后,可以检索第一个元素:

let array = ['a', 'b', 'c'];
array.first();

> 'a'

摘录以查看其运行情况:

Object.defineProperty(Array.prototype, 'first', {
  value() {
    return this.find(Boolean);
  }
});

console.log( ['a', 'b', 'c'].first() );

如果不能保证从索引零开始填充数组,则可以使用Array.prototype.find()

var elements = []
elements[1] = 'foo'
elements[2] = 'bar'

var first = function(element) { return !!element }    
var gotcha = elements.find(first)

console.log(a[0]) // undefined
console.log(gotcha) // 'foo'
array.find(e => !!e);  // return the first element 

因为“ find”返回与过滤器!!e匹配的第一个元素&&与任何元素匹配。

注意: 这只能当第一个元素是不是“Falsy”: ,nullfalseNaN""0undefined

尝试alert(ary[0]);

仅在使用underscore.js(http://underscorejs.org/)的情况下,您可以执行以下操作:

_.first(your_array);

我知道从其他语言到JavaScript的人们都在寻找类似的东西head()first()获取数组的第一个元素,但是如何做到这一点呢?

假设您有以下数组:

const arr = [1, 2, 3, 4, 5];

在JavaScript中,您可以简单地执行以下操作:

const first = arr[0];

或更整洁的新方法是:

const [first] = arr;

但是,您也可以简单地编写如下函数

function first(arr) {
   if(!Array.isArray(arr)) return;
   return arr[0];
}

如果使用下划线,则可以使用功能列表执行与您期望的功能相同的操作:

_.first 

_.head

_.take

与数组一起使用的方法,与对象一起使用(请注意,对象没有确定的顺序!)。

我最喜欢此方法,因为未修改原始数组。

// In case of array
var arr = [];
arr[3] = 'first';
arr[7] = 'last';
var firstElement;
for(var i in arr){
    firstElement = arr[i];
    break;
}
console.log(firstElement);  // "first"

// In case of object
var obj = {
    first: 'first',
    last: 'last',
};

var firstElement;

for(var i in obj){
    firstElement = obj[i];
    break;
}

console.log(firstElement) // First;

在ES2015及更高版本中,使用数组解构:

const arr = [42, 555, 666, 777]
const [first] = arr
console.log(first)

对于那些只关心真实元素的人

ary.find(Boolean);

使用过滤器查找数组中的第一个元素:

在打字稿中:

function first<T>(arr: T[], filter: (v: T) => boolean): T {
    let result: T;
    return arr.some(v => { result = v; return filter(v); }) ? result : undefined;
}

用简单的javascript:

function first(arr, filter) {
    var result;
    return arr.some(function (v) { result = v; return filter(v); }) ? result : undefined;
}

同样,indexOf:

在打字稿中:

function indexOf<T>(arr: T[], filter: (v: T) => boolean): number {
    let result: number;
    return arr.some((v, i) => { result = i; return filter(v); }) ? result : undefined;
}

用简单的javascript:

function indexOf(arr, filter) {
    var result;
    return arr.some(function (v, i) { result = i; return filter(v); }) ? result : undefined;
}

当存在多个匹配项时,JQuery的.first()用于获取与给定jquery的css选择器匹配的第一个DOM元素。

您不需要jQuery即可操纵javascript数组。

为什么不考虑阵列可能为空的时间?

var ary = ['first', 'second', 'third', 'fourth', 'fifth'];
first = (array) => array.length ? array[0] : 'no items';
first(ary)
// output: first

var ary = [];
first(ary)
// output: no items

只需使用 ary.slice(0,1).pop();

var ary = ['first', 'second', 'third', 'fourth', 'fifth'];

console.log("1º "+ary.slice(0,1).pop());
console.log("2º "+ary.slice(0,2).pop());
console.log("3º "+ary.slice(0,3).pop());
console.log("4º "+ary.slice(0,4).pop());
console.log("5º "+ary.slice(0,5).pop());
console.log("Last "+ary.slice(-1).pop());

array.slice(START,END).pop();

您还可以使用.get(0):

alert($(ary).first().get(0));

获取数组的第一个元素。

用它来分割javascript中的字符。

var str = "boy, girl, dog, cat";
var arr = str.split(",");
var fst = arr.splice(0,1).join("");
var rest = arr.join(",");

如果要将视图函数链接到数组,例如

array.map(i => i+1).filter(i => i > 3)

并且想要这些功能之后的第一个元素,您可以简单地添加一个.shift()它不会修改原始元素,这array是一种更好的方式array.map(i => i+1).filter(=> i > 3)[0]

如果您想要数组的第一个元素而不修改原始元素,则可以使用array[0]array.map(n=>n).shift()(不使用地图,您将修改原始元素。在这种情况下,我建议使用该..[0]版本。

当数组索引从零开始时,上述示例可以很好地工作。thomax的答案不依赖于从零开始的索引,而是依赖于Array.prototype.find我没有访问权限的索引以下使用jQuery $ .each的解决方案在我的情况下效果很好。

let haystack = {100: 'first', 150: 'second'},
    found = null;

$.each(haystack, function( index, value ) {
    found = value;  // Save the first array element for later.
    return false;  // Immediately stop the $.each loop after the first array element.
});

console.log(found); // Prints 'first'.

您可以通过lodash _.head轻松地完成此操作。

var arr = ['first', 'second', 'third', 'fourth', 'fifth'];
console.log(_.head(arr));
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js"></script>
var ary = ['first', 'second', 'third', 'fourth', 'fifth'];
alert(Object.values(ary)[0]);

@NicoLwk您应该删除带有拼接的元素,这将使数组移回。所以:

var a=['a','b','c'];
a.splice(0,1);
for(var i in a){console.log(i+' '+a[i]);}

声明原型以获取第一个数组元素为:

Array.prototype.first = function () {
   return this[0];
};

然后将其用作:

var array = [0, 1, 2, 3];
var first = array.first();
var _first = [0, 1, 2, 3].first();

或简单地(:

first = array[0];
var ary = ['first', 'second', 'third', 'fourth', 'fifth'];

console.log(Object.keys(ary)[0]);

制作任何Object数组(req),然后简单Object.keys(req)[0]地选择Object数组中的第一个键。

@thomax的答案非常好,但是如果数组中的第一个元素为false或false-y(0,空字符串等),它将失败。对于未定义的内容,最好只返回true:

const arr = [];
arr[1] = '';
arr[2] = 'foo';

const first = arr.find((v) => { return (typeof v !== 'undefined'); });
console.log(first); // ''

ES6简单:

let a = []
a[7] = 'A'
a[10] = 'B'

let firstValue = a.find(v => v)
let firstIndex = a.findIndex(v => v)
本文地址:http://javascript.askforanswer.com/ruhehuodeshuzudediyigeyuansu.html
文章标签: ,   ,  
版权声明:本文为原创文章,版权归 javascript 所有,欢迎分享本文,转载请保留出处!

文件下载

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

上一篇:
下一篇:

评论已关闭!