写在前面 前几天看到前端胖头鱼的一篇文章《就因为JSON.stringify,我的年终奖差点打水漂了》,讲的就是JSON.stringify在工程开发中的应用,线上用户不能提交表单。...JSON.stringify() JSON.stringify是日常开发中经常用到的JSON对象中的一个方法,用于将一个 JavaScript 对象或值转换为 JSON 字符串,如果指定了一个 replacer...undefined、任意的函数以及symbol值,在序列化过程中会被忽略(出现在非数组对象的属性值中时)或者被转换成 null(出现在数组中时)。...这就是为什么对象中有这些类型的属性,不能使用JSON.parse(JSON.stringify())来进行深拷贝。...但是当我们进行手撕代码的时候,需要考虑各种边界情况,这对于我们来说就比较麻烦,作为面试也是对数据类型的全面考察。
当我们输出 members数组时,第一个元素会将引用的对象打印出来。 ---- 47. 下面代码的输出是什么?...当函数没有返回任何值时,即默认返回 undefined.对数组中的每一个元素来说,函数块都得到了这个返回值,所以结果中每一个元素都是 undefined. ---- 51. 下面代码输出的是什么?...当我们尝试调用一个不存在的函数时 TypeError异常会被抛出。...而我们设定 age等于 21时,我们实际上添加了一个名为 age的属性给全局对象。对象中的属性是可以删除的,全局对象也是如此,所以 deleteage返回 true. 59. 下面代码的输出是什么?...上述例子中,我们将 value 对象进行了解构并传到一个新对象中,因此 x 的默认值为 {number:10} 。 默认参数在调用时才会进行计算,每次调用函数时,都会创建一个新的对象。
这意味着当我们调用 perimeter 时,this 不是指向 shape 对象,而是它的周围作用域(在例子中是 window)。...首先,变量 c 的值是一个对象。接下来,我们给 d 分配了一个和 c 对象相同的引用。 ? 因此当我们改变其中一个对象时,其实是改变了所有的对象。 ---- 7. 输出是什么?...我只是在它的原型中添加了一个方法。基本类型字符串被自动转换为字符串对象,由字符串原型函数生成。因此,所有 string(string 对象)都可以访问该方法! ---- 29. 输出是什么?...当我们输出members数组时,第一个元素会将引用的对象打印出来。 ---- 47. 输出是什么?...当函数没有返回任何值时,即默认返回undefined.对数组中的每一个元素来说,函数块都得到了这个返回值,所以结果中每一个元素都是undefined. ---- 51. 输出的是什么?
首先,JSON.stringify 的使用场景非常广泛,比如说当我们需要把对象保存到本地存储时,或者需要在前后端之间传输数据时,都会用到它。...非数组对象的属性顺序 对于非数组对象来说,属性的顺序在序列化后的 JSON 字符串中并不一定是按照我们定义的顺序出现的,尤其是当一些属性值被忽略时。..."今天我学到了" 作为最终结果。...4、Date 对象的序列化技巧 在使用 JSON.stringify 时,处理日期对象是一个常见的需求。...日期对象的序列化 当我们将 Date 对象传给 JSON.stringify 时,它会调用 Date 对象的 toJSON() 方法,该方法等同于 Date.toISOString(),返回一个标准的
昨天,在我通读vue文档过程中,一篇名为深入响应式原理吸引了我的注意,文中简述了vue数据响应式的原理,以及在操作数组与对象时需要注意的点,在实现上vue也使用了Object.defineProperty...在介绍每个属性前,我们还得引入一个新概念,即: 对象里目前存在的属性描述符有两种主要形式:数据描述符和存取描述符。数据描述符是一个具有值的属性,该值可以是可写的,也可以是不可写的。...,当我们直接使用赋值运算符整个替换数组还是会报错,但如果我们不是整个替换数组而是修改数组中某个元素可以发现并不会报错。...o['age'] = 27; 一个很直观的感受就是,对象赋值就是种瓜得瓜种豆得豆,我们给对象赋予了什么,获取的就是什么。...setter函数在设置属性时触发,同理你得为这个属性提前定义这个方法才行,设置的值将作为参数传入到setter函数中,在这里我们可以加工数据,若未定义此方法默认也是undefined。
但如果: foo(1, undefined); // 输出 2 手动传入 undefined 时, arguments 数组中会出现一个值为 undefined 的元素,依然能和 b 的值进行同步。...[undefined, 2, 3] fn({ x: 1, z: 10 }); // 输出 [1, 2, 10] 上面的例子中,在函数中定义了一个对象 defaultObj ,变通地利用其中的属性作为参数的默认值...它不支持数组方法,当我们使用 arguments 时,如果想要调用数组方法,就必须使用Array.prototype.slice.call先将其转为数组。 可以看出剩余参数的写法更加简洁。...它不支持数组方法,当我们使用 arguments 时,如果想要调用数组方法,就必须使用Array.prototype.slice.call先将其转为数组。...要实现把数组拆解传入给函数,首先不可能一个个传入参数——sum(arr[0], arr[1], arr[2], arr[3]);,因为不是任何时候都知道数组中有多少个元素的,而且数组中可能会非常多的元素
当我们用 class 定义了一个类,然后用关键字 new 调用该类,则会自动调用该类中的 constructor函数,最后生成一个实例对象。...返回一个数组,数组中的元素是对象中所有自有属性的名称,不管属性是否具有可枚举性都能被返回。...// 我是Child的show2方法 继承得实现整体上看上去非常得简洁 在上述代码中,我们看到了,我们在定义 Child类时用到了关键字 extends,申明了 Child类继承Parent类,同时在...当 super在子类的普通方法内时,指向的是父类的原型对象;在子类的静态方法内时,指向的时父类 class A{ show1() { console.log('我是A类的show1方法') }...A{ } B.show() // 我是A类的show方法 ---- 还需要注意的是,当我们在子类的普通方法中通过 super调用父类的方法时,方法中的 this
前言 项目中遇到一个 bug,一个组件为了保留一份 JSON 对象,使用 JSON.stringify 将其转换成字符串,这样做当然是为了避免对象是引用类型造成数据源的污染。...) 方法将一个 JavaScript 值(对象或者数组)转换为一个 JSON 字符串,如果指定了 replacer 是一个函数,则可以选择性地替换值,或者如果指定了 replacer 是一个数组,则可选择性地仅包含数组指定的属性...我个人觉得这样解释是有所不妥的,不妥之处在于“对象或者数组”,因为实际上对于普通的值,我们也可以使用 JSON.stringify,只是我们很少这么用罢了。...值得注意的是,在一开始 replacer 函数会被传入一个空字符串作为 key 值,代表着要被 stringify 的这个对象。...JSON.stringify([undefined, Object, Symbol("")]); // '[null,null,null]' 一种是非数组对象,在序列化的过程中会被忽略。
返回值这段在下方bind应用中有详细的示例解析。 call/apply/bind的核心理念:借用方法 看到一个非常棒的例子: 生活中: 平时没时间做饭的我,周末想给孩子炖个腌笃鲜尝尝。...但是没有适合的锅,而我又不想出去买。所以就问邻居借了一个锅来用,这样既达到了目的,又节省了开支,一举两得。...当然是借用 A 对象的方法啦,既达到了目的,又节省了内存。 这就是call/apply/bind的核心理念:借用方法。 借助已实现的方法,改变方法中数据的this指向,减少重复代码,节省内存。...let 用let声明i也可以输出1-5: 因为let是块级作用域,所以每次都会创建一个新的变量,所以setTimeout每次读的值都是不同的,详解。 2....回调函数this丢失问题: 这是一个常见的问题,下面是我在开发VSCode插件处理webview通信时,遇到的真实问题,一开始以为VSCode的API哪里出问题,调试了一番才发现是this指向丢失的问题
为方便大家能够更快的做题,而不把时间浪费在翻译上,我又花了几个小时把它们翻译成了中文,当然已经获得了作者授权。 ? 文中有些点作者解释的不太完整,为了更好的理解,我在文中添加了一些个人解释。...在我们声明(初始化)它们之前,它们是不可访问的。 这被称为“暂时死区”。 当我们在声明变量之前尝试访问变量时,JavaScript会抛出一个ReferenceError。...首先,变量c为对象保存一个值。 之后,我们将d指定为c与对象相同的引用。 ? 更改一个对象时,可以更改所有对象。 ---- 7. 下面代码的输出是什么?...虽然它看起来像一个数字,但它并不是一个真正的数字:它有一堆额外的功能,是一个对象。 当我们使用==运算符时,它只检查它是否具有相同的值。 他们都有3的值,所以它返回true。...数组是一个对象,因此typeof args返回object。 ---- 20. 下面代码的输出是什么?
前言 项目中遇到一个 bug,一个组件为了保留一份 JSON 对象,使用 JSON.stringify 将其转换成字符串,这样做当然是为了避免对象是引用类型造成数据源的污染。...方法将一个 JavaScript 值**(对象或者数组)**转换为一个 JSON 字符串,如果指定了 replacer 是一个函数,则可以选择性地替换值,或者如果指定了 replacer 是一个数组,...我个人觉得是有所不妥的,不妥之处在于“对象或者数组”,因为实际上对于普通的值,我们也可以使用 JSON.stringify,只是我们很少这么用罢了。...,利用的是 JSON.stringify 中对象属性值为 undefined 就会在序列化中被忽略的特性(后面我们会提到) 值得注意的是,在一开始 replacer 函数会被传入一个空字符串作为 key..., Object, Symbol("")]); // '[null,null,null]' 一种是非数组对象,在序列化的过程中会被忽略 JSON.stringify({ x: undefined, y:
为方便大家能够更快的做题,而不把时间浪费在翻译上,我又花了几个小时把它们翻译成了中文,当然已经获得了作者授权。 ? 文中有些点作者解释的不太完整,为了更好的理解,我在文中添加了一些个人解释。...在我们声明(初始化)它们之前,它们是不可访问的。这被称为“暂时死区”。当我们在声明变量之前尝试访问变量时,JavaScript会抛出一个ReferenceError。...首先,变量c为对象保存一个值。之后,我们将d指定为c与对象相同的引用。 ? 更改一个对象时,可以更改所有对象。 ---- 7. 下面代码的输出是什么?...虽然它看起来像一个数字,但它并不是一个真正的数字:它有一堆额外的功能,是一个对象。 当我们使用==运算符时,它只检查它是否具有相同的值。他们都有3的值,所以它返回true。...数组是一个对象,因此typeof args返回object。 ---- 20. 下面代码的输出是什么?
最后会输出 '活下去'是不是很意外,是不是很惊喜。竟然是这个结果。这的是我们都没有想到对吧?子所以这这个结果:因为:obj这个对象中有 toJSON()方法。...undefined、函数、symbol值,在序列化过程中会被忽略 【出现在非数组对象的属性值中时】let person = Symbol('小魔神');const obj = {person,un: undefined...、函数、symbol值,在序列化过程中会被忽略undefined、任意的函数、symbol 值将会换成 null(出现在数组中时)let person = Symbol('小魔神');let sayFun...6.日期对象将会对其序列化为字符串string7.循环引用的对象将会抛出错误8.undefined、任意的函数、symbol 值,在序列化过程中会被忽略【出现在非数组对象的属性值中时】或者被转换成 null...或者说方法会被丢失也就是说:如果你原来的某一个对象中包含方法,在使用JSON之后,该方法会被丢失的哈~2.JSON 数据格式为键/值对。
不过这并不是长久之计,比如当我们需要创建大型数组时。...没有空洞的数组往往表现得更好 在大多数编程语言中,数组是连续的值序列。在 JavaScript 中,Array 是一个将索引映射到元素的字典。...在某些引擎中,例如V8,如果切换到性能较低的数据结构,这种改变将会是永久性的。即使所有空洞都被填补,它们也不会再切换回来了。...所以操作这个数组时应该比用构造函数创建的更快。不过 创建 数组的速度比较慢,因为引擎可能需要随着数组的增长多次重新分配连续的内存。...我的侧重点是可读性,而不是性能。 你是否需要创建一个空的数组,以后将会完全填充? 1new Array(LEN) 你需要创建一个用原始值初始化的数组吗?
当我们把对象值赋值给另外一个变量时,复制的是对象的指针,指向同一块内存地址,意思是,变量中保存的实际上只是一个指针,这个指针指向内存堆中实际的值,数组 对象 堆(heap)和栈(stack)有什么区别存储机制...,用来存新对象,并且修改新对象不会影响原对象 3、赋值: 当我们把一个对象赋值给一个新的变量时,赋的是该对象在栈中的内存地址,而不是堆中的数据。...17、some( ):当数组中有一个元素在callback上被返回true时就返回true。...function (x) { //柯里化函数(闭包) return function (y) { return x + y } } add(1)(2) 这样做有什么好处,我得理解是在需要的情况下生成一个中间工具...我在项目中:就是从目标对象或数组中提取自己想要的变量。最常用的场景是:element-ui,vant-ui按需引入,请求接口返回数据,提取想要数据。
在大多数问题中,我真的不知道输出是什么,直到我自己尝试了它们,才开始慢慢理解。 所以我在这里记录它们,以便其他人可以利用它来梳理JS的知识盲点。...问题2 答案: false // 删除运算符只删除对象中的Key true // 当我们在任何变量之前不使用任何声明时, //它将被视为全局变量,并将作为可删除实体添加到Window对象中。...members = [ X201 ] person = null 问题4: 答案: Silver Surfer 因为当我们返回一个属性时,属性的值等于返回值,而不是构造函数中设置的值。...问题7 答案: 1 2 undefined 3 undefined 4 如果我们不传递初始值,那么默认情况下 x 将是数组的第一个值,y 将是数组的第二个值。...three - undefined 如果我们使用标记的模板文字,第一个参数的值总是字符串值的数组。
特别是生成器,在react中如果你有用过redux中间件redux-saga那么你一定对生成器很熟悉。 本文是笔者对于迭代器与生成器的理解,希望在项目中有所帮助....*定义的函数,内部是yield执行的状态机 当我们调用函数生成器时,并不会立即执行,返回一个遍历对象并返回一个next方法,当遍历对象调用next时,就会返回yield执行的状态机,并返回一个迭代器对象的值...当我们for...of时,内部会依次调用next方法进行遍历数据。...,迭代器对象有一个next方法,当我们调用next方法时,会返回一个对象{value: xx, done: false},value就是当前迭代器迭代的具体值,当迭代器对象每调用一次next方法时,就会获取当前的值...,直到迭代完全,最后返回{done: true, value: undefined} 每一个迭代器都可以被for...of、数组解构以及数组扩展 生成器函数,yield可以中断函数,当我们调用函数生成器时
领取专属 10元无门槛券
手把手带您无忧上云