How does the splice function work here?

问题

Please help me out to understand this example.

function fun(a){
    this.length = 1;
    this.splice = [].splice;
    this[0] = a;
    return this;
};

Now, when I execute this function the result is an array.

f = new fun('hi');// result will be : ["hi"]

Why is that?

If I remove this.length=1 OR this.splice = [].splice, the result will be different.

f = new fun('hi'); // result will be : fun {0: "a", splice: function}

Why is that?

I also see this technique used in jQuery. Please describe to me how this is working programmatically.

回答1:

There is nothing programmatical about it. It's just the way a browser/js engine chooses to show you some variable in the console.

The console is generally for developers as they are the ones who open those things. So the browser does a little sniffing to show the developer what this object he's/she's dealing with is. If it looks like an array, it probably should be printed like an array.

Like the following list shows, there are some differences between the browsers. Namely, IE and node do nothing. My interpretation is that printing in node should yield the complete view and not just the sniffed view. The length seems to satisfy Opera 12 to show it as an array.

Why browsers use index, length and splice is an entirely different story. It's probably the smallest set of properties that denote an array with high probability. Look at it, what else would it be, if not an array?

Chrome 36, Firefox 30 and Opera 18 behave the same way:

fun as-is is ["hi"]
fun without length is fun { 0: 'hi', splice: function}
fun without splice is fun { 0: 'hi', length: 1}

Opera 12 shows:

fun as-is is Object ["hi"]
fun without length is Object
fun without splice is Object ["hi"]

IE 9 and node v0.8 did no sniffing at all (here IE output, node output very similar):

fun as-is is {0 : "hi", length : 1, splice : function splice() { [native code] }}
fun without length is {0 : "hi", splice : function splice() { [native code] }}
fun without splice is {0 : "hi", length : 1}

回答2:

What you construct is not an array. I believe that your object may have a few features that let console recognize whether a given object is an array or not.

var arr = [];
var f = new fun('asd');

typeof arr; // "object"
typeof f; // "object"

arr instanceof Array; // "true"
f instanceof Array; // "false"

回答3:

I'm not sure, how you can get that only "hi" result, because when I tried below code in a Fiddle, I get Object { 0: "hi", length: 1, splice: splice() }. Which is make sense because what it does is creating an object which has 3 attributes(length, splice, and index[0]).

function fun(a){
this.length = 1; 
this.splice = [].splice;
this[0] = 'hi';
    return this;
}
f = new fun('hi');
console.log(f); //get the object f
console.log(f[0]); //get the string inside index-0
console.log(f.length); //get the length value which is already assigned before
console.log(f.splice); //it returns a function, which I believe a splice function

来源：https://stackoverflow.com/questions/24930737/how-does-the-splice-function-work-here

标签

javascript

splice