悟透前端 | 参悟Javascript中的call和apply

{"type":"doc","content":[{"type":"blockquote","content":[{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","text":"对于前端工程师来说，","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"call","attrs":{}}],"attrs":{}},{"type":"text","text":"、","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"apply","attrs":{}}],"attrs":{}},{"type":"text","text":"算是常用的函数方法，允许通过函数和在函数调用中指定","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"this","attrs":{}}],"attrs":{}},{"type":"text","text":"的指向。那么这两个方法到底有什么区别呢？本文将详细介绍这两个方法，顺便加深对其理解。","attrs":{}}]}],"attrs":{}},{"type":"heading","attrs":{"align":null,"level":3},"content":[{"type":"text","text":"call","attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","text":"方法使用一个指定的 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"this","attrs":{}}],"attrs":{}},{"type":"text","text":" 值和单独给出的一个或多个参数来调用一个函数。允许为不同的对象分配和调用属于一个对象的函数/方法。提供新的 ","attrs":{}},{"type":"text","marks":[{"type":"strong","attrs":{}}],"text":"this ","attrs":{}},{"type":"text","text":"值给当前调用的函数/方法。你可以使用 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"call","attrs":{}}],"attrs":{}},{"type":"text","text":" 来实现继承：写一个方法，然后让另外一个新的对象来继承它（而不是在新对象中再写一次这个方法）。","attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null}},{"type":"codeblock","attrs":{"lang":"javascript"},"content":[{"type":"text","text":"const obj = {\n domain: \"www.infoq.cn\",\n};\nfunction siteurl(protocol, path) {\n console.log([protocol, this.domain, path].join(\"\"));\n}\nsiteurl.call(obj, \"https://\", \"/u/devpoint\"); // https://www.infoq.cn/u/devpoint","attrs":{}}]},{"type":"heading","attrs":{"align":null,"level":4},"content":[{"type":"text","text":"语法","attrs":{}}]},{"type":"codeblock","attrs":{"lang":"javascript"},"content":[{"type":"text","text":"function.call(thisArg, arg1, arg2, ...)","attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null}},{"type":"bulletedlist","content":[{"type":"listitem","content":[{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"codeinline","content":[{"type":"text","marks":[{"type":"strong","attrs":{}}],"text":"thisArg","attrs":{}}],"attrs":{}},{"type":"text","marks":[{"type":"strong","attrs":{}}],"text":"：可选的。","attrs":{}}]}],"attrs":{}}],"attrs":{}},{"type":"paragraph","attrs":{"indent":1,"number":0,"align":null,"origin":null},"content":[{"type":"text","text":"在 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"function","attrs":{}}],"marks":[{"type":"italic"}],"attrs":{}},{"type":"text","text":" 函数运行时使用的 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"this","attrs":{}}],"attrs":{}},{"type":"text","text":" 值。请注意，","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"this","attrs":{}}],"attrs":{}},{"type":"text","text":"可能不是该方法看到的实际值：如果这个函数处于非严格模式下，则指定为 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"null","attrs":{}}],"attrs":{}},{"type":"text","text":" 或 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"undefined","attrs":{}}],"attrs":{}},{"type":"text","text":" 时会自动替换为指向全局对象，原始值会被包装。","attrs":{}}]},{"type":"bulletedlist","content":[{"type":"listitem","content":[{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"codeinline","content":[{"type":"text","marks":[{"type":"strong","attrs":{}}],"text":"arg1, arg2, ...","attrs":{}}],"attrs":{}},{"type":"text","text":"：指定的参数列表。","attrs":{}}]}],"attrs":{}}],"attrs":{}},{"type":"heading","attrs":{"align":null,"level":4},"content":[{"type":"text","text":"返回值","attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","text":"使用调用者提供的 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"this","attrs":{}}],"attrs":{}},{"type":"text","text":" 值和参数调用该函数的返回值。若该方法没有返回值，则返回 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"undefined","attrs":{}}],"attrs":{}},{"type":"text","text":"。","attrs":{}}]},{"type":"heading","attrs":{"align":null,"level":3},"content":[{"type":"text","text":"apply","attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null}},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"codeinline","content":[{"type":"text","text":"apply()","attrs":{}}],"marks":[{"type":"strong"}],"attrs":{}},{"type":"text","text":" 方法调用一个具有给定","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"this","attrs":{}}],"attrs":{}},{"type":"text","text":"值的函数，以及作为一个数组（或类似数组对象）提供的参数。在调用一个存在的函数时，你可以为其指定一个 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"this","attrs":{}}],"attrs":{}},{"type":"text","text":" 对象。 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"this","attrs":{}}],"attrs":{}},{"type":"text","text":" 指当前对象，也就是正在调用这个函数的对象。 使用 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"apply","attrs":{}}],"attrs":{}},{"type":"text","text":"， 可以只写一次这个方法然后在另一个对象中继承它，而不用在新对象中重复写该方法。","attrs":{}}]},{"type":"heading","attrs":{"align":null,"level":4},"content":[{"type":"text","text":"语法","attrs":{}}]},{"type":"codeblock","attrs":{"lang":"javascript"},"content":[{"type":"text","text":"func.apply(thisArg, [argsArray]);","attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null}},{"type":"bulletedlist","content":[{"type":"listitem","content":[{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"codeinline","content":[{"type":"text","marks":[{"type":"strong","attrs":{}}],"text":"thisArg","attrs":{}}],"attrs":{}},{"type":"text","marks":[{"type":"strong","attrs":{}}],"text":"：必选的。","attrs":{}}]}],"attrs":{}}],"attrs":{}},{"type":"paragraph","attrs":{"indent":1,"number":0,"align":null,"origin":null},"content":[{"type":"text","text":"在 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"func","attrs":{}}],"marks":[{"type":"italic"}],"attrs":{}},{"type":"text","text":" 函数运行时使用的 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"this","attrs":{}}],"attrs":{}},{"type":"text","text":" 值。请注意，","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"this","attrs":{}}],"attrs":{}},{"type":"text","text":"可能不是该方法看到的实际值：如果这个函数处于非严格模式下，则指定为 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"null","attrs":{}}],"attrs":{}},{"type":"text","text":" 或 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"undefined","attrs":{}}],"attrs":{}},{"type":"text","text":" 时会自动替换为指向全局对象，原始值会被包装。","attrs":{}}]},{"type":"bulletedlist","content":[{"type":"listitem","content":[{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"codeinline","content":[{"type":"text","marks":[{"type":"strong","attrs":{}}],"text":"argsArray","attrs":{}}],"attrs":{}},{"type":"text","marks":[{"type":"strong","attrs":{}}],"text":"：可选的。","attrs":{}}]}],"attrs":{}}],"attrs":{}},{"type":"paragraph","attrs":{"indent":1,"number":0,"align":null,"origin":null},"content":[{"type":"text","text":"一个数组或者类数组对象，其中的数组元素将作为单独的参数传给 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"func","attrs":{}}],"attrs":{}},{"type":"text","text":" 函数。如果该参数的值为 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"null","attrs":{}}],"attrs":{}},{"type":"text","text":" 或  ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"undefined","attrs":{}}],"attrs":{}},{"type":"text","text":"，则表示不需要传入任何参数。从ECMAScript 5 开始可以使用类数组对象。 浏览器兼容性 请参阅本文底部内容。","attrs":{}}]},{"type":"heading","attrs":{"align":null,"level":4},"content":[{"type":"text","text":"返回值","attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","text":"调用有指定","attrs":{}},{"type":"codeinline","content":[{"type":"text","marks":[{"type":"strong","attrs":{}}],"text":"this","attrs":{}}],"attrs":{}},{"type":"text","text":"值和参数的函数的结果。","attrs":{}}]},{"type":"heading","attrs":{"align":null,"level":3},"content":[{"type":"text","text":"call和apply的区别","attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","text":"它们的作用一模一样，区别仅在于传入参数形式的不同。","attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null}},{"type":"image","attrs":{"src":"https://static001.geekbang.org/infoq/5c/5c13fa338c1f57e0bbf2ec954cbd8c7e.jpeg","alt":null,"title":"","style":[{"key":"width","value":"75%"},{"key":"bordertype","value":"none"}],"href":"","fromPaste":false,"pastePass":false}},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null}},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null}},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null}},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"codeinline","content":[{"type":"text","text":"apply","attrs":{}}],"attrs":{}},{"type":"text","text":" 接受两个参数，第一个参数指定了函数体内 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"this","attrs":{}}],"attrs":{}},{"type":"text","text":" 对象的指向，第二个参数为一个带下标的集合，这个集合可以为数组，也可以为类数组，","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"apply","attrs":{}}],"attrs":{}},{"type":"text","text":" 方法把这个集合中的元素作为参数传递给调用的函数：","attrs":{}}]},{"type":"codeblock","attrs":{"lang":"javascript"},"content":[{"type":"text","text":"const func = function (a, b, c) {\n console.log([a, b, c]);\n};\nfunc.apply(null, [1, 2, 3]); // [ 1, 2, 3 ]","attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null}},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","text":"这段代码中，参数 1、2、3 被放在数组中一起传入 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"func","attrs":{}}],"attrs":{}},{"type":"text","text":" 函数，它们分别对应 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"func","attrs":{}}],"attrs":{}},{"type":"text","text":" 参数列表中的 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"a 、b 、c","attrs":{}}],"attrs":{}},{"type":"text","text":"。","attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"codeinline","content":[{"type":"text","text":"call","attrs":{}}],"attrs":{}},{"type":"text","text":" 传入的参数数量不固定，跟 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"apply","attrs":{}}],"attrs":{}},{"type":"text","text":" 相同的是，第一个参数也是代表函数体内的 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"this","attrs":{}}],"attrs":{}},{"type":"text","text":" 指向，从第二个参数开始往后，每个参数被依次传入函数：","attrs":{}}]},{"type":"codeblock","attrs":{"lang":"javascript"},"content":[{"type":"text","text":"const func = function (a, b, c) {\n console.log([a, b, c]);\n};\nfunc.call(null, 1, 2, 3); // [ 1, 2, 3 ]","attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","text":"调用一个函数时，Javascript 的解释器并不会计较形参和实参在数量、类型以及顺序上的区别，Javascript 的参数在内部就是用一个数组来表示的。","attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null}},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","text":"从这个意义上说，","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"apply","attrs":{}}],"attrs":{}},{"type":"text","text":" 比 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"call","attrs":{}}],"attrs":{}},{"type":"text","text":" 的使用率更高，不关心具体多少参数被传入函数，只要用 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"apply","attrs":{}}],"attrs":{}},{"type":"text","text":" 一股脑地推过去就可以了。","attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null}},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"codeinline","content":[{"type":"text","text":"call","attrs":{}}],"attrs":{}},{"type":"text","text":" 是包装在 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"apply","attrs":{}}],"attrs":{}},{"type":"text","text":" 上的一颗语法糖，如果明确地知道函数接收多少个参数，而且想一目了然地表达形参和实参的对应关系，那么可以用 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"call","attrs":{}}],"attrs":{}},{"type":"text","text":" 来传送参数。","attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null}},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","text":"当使用 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"call","attrs":{}}],"attrs":{}},{"type":"text","text":" 或者 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"apply","attrs":{}}],"attrs":{}},{"type":"text","text":" 的时候，如果传入的第一个参数为 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"null","attrs":{}}],"attrs":{}},{"type":"text","text":" ，函数体内的 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"this","attrs":{}}],"attrs":{}},{"type":"text","text":" 会指向默认的宿主对象，在浏览器中则是 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"window","attrs":{}}],"attrs":{}},{"type":"text","text":" ：","attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null}},{"type":"codeblock","attrs":{"lang":null},"content":[{"type":"text","text":"const func = function(a,b,c){\n console.log(this === window );\n}\nfunc.apply(null,[1,2,3]); // true","attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null}},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","text":"如果是在严格模式下，函数体内的 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"this","attrs":{}}],"attrs":{}},{"type":"text","text":" 还是为 null ：","attrs":{}}]},{"type":"codeblock","attrs":{"lang":"javascript"},"content":[{"type":"text","text":"const func = function (a, b, c) {\n console.log(this === window);\n};\nfunc.apply(null, [1, 2, 3]); // true","attrs":{}}]},{"type":"heading","attrs":{"align":null,"level":4},"content":[{"type":"text","text":"改变this指向","attrs":{}}]},{"type":"codeblock","attrs":{"lang":"javascript"},"content":[{"type":"text","text":"const obj = {\n site: \"https://www.infoq.com\",\n};\nfunction func() {\n console.log(this.site);\n}\nfunc.call(obj); // https://www.infoq.com","attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null}},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"codeinline","content":[{"type":"text","text":"call","attrs":{}}],"attrs":{}},{"type":"text","text":" 方法的第一个参数是作为函数上下文的对象，上面的代码把 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"obj","attrs":{}}],"attrs":{}},{"type":"text","text":" 作为参数传给了 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"func","attrs":{}}],"attrs":{}},{"type":"text","text":"，此时函数里的 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"this","attrs":{}}],"attrs":{}},{"type":"text","text":" 便指向了 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"obj","attrs":{}}],"attrs":{}},{"type":"text","text":" 对象。此处 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"func","attrs":{}}],"attrs":{}},{"type":"text","text":" 函数相当于下面的方法：","attrs":{}}]},{"type":"codeblock","attrs":{"lang":"javascript"},"content":[{"type":"text","text":"const obj = {\n site: \"https://www.infoq.com\",\n};\nfunction func() {\n console.log(obj.site);\n}","attrs":{}}]},{"type":"heading","attrs":{"align":null,"level":3},"content":[{"type":"text","text":"apply()方法的一些妙用","attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null}},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"codeinline","content":[{"type":"text","text":"Math.max","attrs":{}}],"marks":[{"type":"strong"}],"attrs":{}},{"type":"text","marks":[{"type":"strong","attrs":{}}],"text":" 可以实现得到数组中最大的一项","attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null}},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","text":"因为","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"Math.max","attrs":{}}],"attrs":{}},{"type":"text","text":"不支持","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"Math.max([param1,param2])","attrs":{}}],"attrs":{}},{"type":"text","text":"也就是数组，但是它支持","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"Math.max(param1,param2...)","attrs":{}}],"attrs":{}},{"type":"text","text":"，所以可以根据","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"apply","attrs":{}}],"attrs":{}},{"type":"text","text":"的特点来解决 ","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"var max=Math.max.apply(null,array)","attrs":{}}],"attrs":{}},{"type":"text","text":"，这样就轻易的可以得到一个数组中的最大项（","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"apply","attrs":{}}],"attrs":{}},{"type":"text","text":"会将一个数组转换为一个参数接一个参数的方式传递给方法）这块在调用的时候第一个参数给了","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"null","attrs":{}}],"attrs":{}},{"type":"text","text":"，这是因为没有对象去调用这个方法，我只需要用这个方法帮我运算，得到返回的结果就行，所以直接传递了一个","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"null","attrs":{}}],"attrs":{}},{"type":"text","text":"过去。","attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null}},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","text":"用这种方法也可以实现得到数组中的最小项：","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"Math.min.apply(null,array)","attrs":{}}],"attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null}},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"codeinline","content":[{"type":"text","text":"Array.prototype.push","attrs":{}}],"attrs":{}},{"type":"text","text":"实现两个数组的合并","attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null}},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null},"content":[{"type":"text","text":"同样","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"push","attrs":{}}],"attrs":{}},{"type":"text","text":"方法没有提供","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"push","attrs":{}}],"attrs":{}},{"type":"text","text":"一个数组，但是它提供了","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"push(param1,param2...paramN)","attrs":{}}],"attrs":{}},{"type":"text","text":"，同样也可以用","attrs":{}},{"type":"codeinline","content":[{"type":"text","text":"apply","attrs":{}}],"attrs":{}},{"type":"text","text":"来转换一下这个数组，即：","attrs":{}}]},{"type":"codeblock","attrs":{"lang":"javascript"},"content":[{"type":"text","text":"const target = new Array(\"1\", \"2\", \"3\");\nconst source = new Array(\"4\", \"5\", \"6\");\nconst result = Array.prototype.push.apply(target, source); // 得到合并后数组的长度，因为push就是返回一个数组的长度\nconsole.log(target); // [ '1', '2', '3', '4', '5', '6' ]\nconsole.log(source); // [ '4', '5', '6' ]\nconsole.log(result); // 6","attrs":{}}]},{"type":"paragraph","attrs":{"indent":0,"number":0,"align":null,"origin":null}}]}