在Jquery / javascript中理解控制台中的“切片”

Question

i am deconstructing a carasoul plugin called Unslider.js , and i have a difficulty understanding a little peice of code , so here i am on stack overflow .

My difficulty is understanding the below line :

target = li.eq(index);

lets analyse that ,

target is a variable .

li is an object , actually let me clarify what li is , previously in the code using the find() method in Jquery which returns a set of child elements so basically li is a set of <li> elements .

next , eq is often used to filter element further .

index is ofcourse the current element (i am not sure about this interpretation though) .

so basically i understand the below line :

        target = li.eq(index);

target is the current li element, am i right , i think so .

well lets move on to what my real difficulty is , when i console.log(target) , i get the following results :

"taget is" unslider.js:285
Object { length: 0, prevObject: Object, context: <div.banner>, selector: ">ul >li.slice(3,4)" } unslider.js:286
"taget is" unslider.js:285
Object { 0: <li>, length: 1, prevObject: Object, context: <div.banner>, selector: ">ul >li.slice(1,2)" } unslider.js:286
"taget is" unslider.js:285
Object { 0: <li>, length: 1, prevObject: Object, context: <div.banner>, selector: ">ul >li.slice(2,3)" } unslider.js:286
"taget is" unslider.js:285
Object { length: 0, prevObject: Object, context: <div.banner>, selector: ">ul >li.slice(3,4)" } unslider.js:286
"taget is" unslider.js:285
Object { 0: <li>, length: 1, prevObject: Object, context: <div.banner>, selector: ">ul >li.slice(1,2)" } unslider.js:286
"taget is" unslider.js:285
Object { 0: <li>, length: 1, prevObject: Object, context: <div.banner>, selector: ">ul >li.slice(2,3)" } unslider.js:286
"taget is" unslider.js:285
Object { length: 0, prevObject: Object, context: <div.banner>, selector: ">ul >li.slice(3,4)" } unslider.js:286
"taget is" unslider.js:285
Object { 0: <li>, length: 1, prevObject: Object, context: <div.banner>, selector: ">ul >li.slice(1,2)" } unslider.js:286
"taget is" unslider.js:285
Object { 0: <li>, length: 1, prevObject: Object, context: <div.banner>, selector: ">ul >li.slice(2,3)" } unslider.js:286
"taget is" unslider.js:285
Object { length: 0, prevObject: Object, context: <div.banner>, selector: ">ul >li.slice(3,4)" } unslider.js:286
"taget is" unslider.js:285
Object { 0: <li>, length: 1, prevObject: Object, context: <div.banner>, selector: ">ul >li.slice(1,2)" }

now what does this line mean ..

selector: ">ul >li.slice(3,4)", 

i mean the slice(3,4) part and that part keeps changing with different values !! it would be great if somebody could come along and explain what that is .

Thank you.

Alexander.

Answer 1

Slice is used to return a subset of an array. In this case the values are always separated by one, so it will return an array of a single element.

var li = ['a','b','c','d'];
console.log(li.slice(2,3));
>  ['c']

So it's just a way to select one element from the list, but generally applicable to selecting a range of elements as well.