今日笔记：关于Symbol(Symbol.iterator)的使用笔记

最新推荐文章于 2024-04-15 06:25:57 发布
最新推荐文章于 2024-04-15 06:25:57 发布
阅读量1.1k 收藏
点赞数
文章标签： javascript css html es6 es6/es7
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Hereisrubbish/article/details/121445056
版权
这篇笔记介绍了如何利用Symbol.iterator遍历JavaScript对象的属性，特别是当对象的属性在原型链上存在Symbol.iterator时，通过定义iterator并调用next()方法实现遍历。示例中展示了针对banji.stus的遍历过程。
摘要由CSDN通过智能技术生成 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script type="text/javascript">
        window.onload=function()
        {
            //声明一个对象
            const banji=
            {
                name:"garde3class2",
                stus:
                [
                    "xiaoming",
                    "xiaohong",
                    "xiaotian"
                ],
            }
            console.log(banji);
            //遍历这个对象
            /*
            for(let v of banji)
            {
                console.log(v);
            }
            */
            //
            let iterator=banji.st
最低0.47元/天 解锁文章
狮鹫、
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Symbol.Iterator简单理解
m0_46525076的博客
07-10 6440
symbol 是什么？ Itertor是什么？ symbol的内置符号symbol.Iterator，有什么用？ 为什么会出现for..of? for..of怎么用? 首先symbol是es6新增的类型，它是一个基本类型，symbol英文翻译是符号的意思。 在叙述symbol之前，推出一个概念，“以操作目标为程序本身的行为特性的编程，我们称为元编程。” 我们已知symbol是es6新增类型，按照逻辑推演：作为新增的类型，symbol一定是为了弥补了之前的不足，所以才出现的
lterator 迭代器 静态属性Symbol.iterator Symbol(Symbol.iterator)
小竹子的博客
08-19 3680
** lterator迭代器 ** 迭代模式：提供一种方法是可以顺序获得聚合对象中的各个元素，是一种最简单也最常见的设计模式。他可以让用户透过特定的接口巡防集合中的每一个元素而不用了解底层的实现 迭代器简介：依照迭代模式的思想而实现，分为内部迭代器和外部迭代器 内部迭代：本身是函数，该函数内部定义好迭代规则，完全接手整个迭代过程 外部：只需要一次初始话的调用Array.prototype.forE...
Symbol
u011649976的博客
08-01 279
概述 ES5 的对象属性名都是字符串，这容易造成属性名的冲突。比如，你使用了一个他人提供的对象，但又想为这个对象添加新的方法（mixin 模式），新方法的名字就有可能与现有方法产生冲突。如果有一种机制，保证每个属性的名字都是独一无二的就好了，这样就从根本上防止属性名的冲突。这就是 ES6 引入Symbol的原因。 ES6 引入了一种新的原始数据类型Symbol，表示独一无二的值。它是
ES6的学习笔记……Symbol和iterator的使用
李振恒
04-21 296
Symbol For in 无法遍历到 iterator Iterator的底层原理 对象没有部署iterator，所以不能用for of遍历
4 / 4 聊一聊Symbol.iterator属性
小柒的前端之旅
04-05 1086
前面的话 前端每日，巩固基础，不打烊！！！ 解答 从一道题来分析: const person = { name: 'xiaoqi', age: 20 } // [...person]; ? // ['xiaoqi',20] ...
python迭代器使用笔记.doc
10-01
Python 迭代器使用笔记 迭代器是一种访问集合元素的方式，能够记住遍历的位置。迭代器对象从集合的第一个元素开始访问，直到所有的元素被访问完毕。迭代器只能往前不会后退。 1. 可迭代对象 可迭代对象是指可以...
面向对象程序设计英文教学课件：14_Design Iterator.ppt
06-04
- C++中的迭代器有五种不同的类型：输入迭代器（Input Iterator）、输出迭代器（Output Iterator）、前向迭代器（Forward Iterator）、双向迭代器（Bidirectional Iterator）和随机访问迭代器（Random Access ...
F_Java源码分析：深入探讨Iterator模式.doc
06-09
F_Java源码分析：深入探讨Iterator模式
CUJ：标准库：定义iterator和const iterator.docx
12-06
在C++编程中，迭代器（iterator）是一种设计模式，用于抽象地访问序列中的元素，类似于指针，但提供了更高级别的抽象。迭代器允许程序员以统一的方式遍历不同的数据结构，如数组、向量、链表等。在C++标准库中，迭代...
Iterator和Symbol
ccxCode的博客
03-29 254
迭代模式： 提供一种方法可以顺序获得聚合对象中的各个元素，是一种最简单也是最常见的一种设计模式。它可以让用户透过特定的接口巡访集合中的每一个元素而不用了解底层的实现 迭代器简介： 依照与迭代模式的思想而实现，分为内部迭代器和外部迭代器 内部迭代器： 本身是函数，该函数内部定义好迭代规则，完全接手整个迭代过程，外部只需要一次初始化调用 Array.prototype.forEach 外部迭代器： 本...
JavaScript重写Symbol(Symbol.iterator)实现迭代器（1）
xwc999
06-06 743
iterator迭代,做的跟java集合迭代差不多就行了 示例图 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head&
ES6 学习（三）-- Symbol Iterator 迭代器 Set 结构 Map 结构
最新发布
m0_60666452的博客
04-15 856
ES6 规定，默认的Iterator接口部署在数据结构的Symbol.iterator属性，或者说，一个数据结构只要具有Symbol.iterator属性，就可以认为是“ 可遍历的 ”(iterable)。对象是无序列非线性的，但是我们自己学习数组的设计,也就是使用Array.prototype[Symbol.Iterator]最为该对象的[Symbol.Iterator]，同时添加属性数作为长度，这样可以为线性对象也就添加了Iterator接口。一是为各种数据结构，提供一个统一的、简便的访问接口；
JavaScript重写Symbol(Symbol.iterator)实现迭代器（2）
xwc999
06-06 881
重写数组for…of底层用的迭代器 for…of 底层用Symbol(Symbol.iterator)迭代器 …arr 底层用Symbol(Symbol.iterator)迭代器 示例图 代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-
Iterator遍历器
oiaa的博客
03-17 217
概念 遍历器（Iterator）就是这样一种机制。它是一种接口，为各种不同的数据结构提供统一的访问机制。任何数据结构只要部署 Iterator 接口，就可以完成遍历操作（即依次处理该数据结构的所有成员） 作用 Iterator 的作用有三个：一是为各种数据结构，提供一个统一的、简便的访问接口；二是使得数据结构的成员能够按某种次序排列；三是 ES6 创造了一种新的遍历命令for...of循环，...
ES6中iterator和Symbol.iterator的理解
qq_40434213的博客
05-07 599
Iterator遍历器是一种为各种不同数据结构提供同意访问机制的接口 Iterator的作用： 1、一是为各种数据结构，提供一个统一的、简便的访问接口 2、是的数据结构的成员按照某种次序排列 3、为ES6中新增了一种for…of循环 Iterator 的遍历过程是这样的。 （1）创建一个指针对象，指向当前数据结构的起始位置。也就是说，遍历器对象本质上，就是一个指针对象。 （2）第一次调用指针对象的next方法，可以将指针指向数据结构的第一个成员。 （3）第二次调用指针对象的next方法，指针就指向数据结构的
ES6新特性（四） Symbol和迭代器Iterator的使用
F_mengze的博客
05-02 1922
一、Symbol 应用场景：因为每一个 Symbol 的值都是不相等的，所以 Symbol 作为对象的属性名，可以保证属性不重名。 1.1. 什么是Symbol ? 1.1.1. Symbol是ES6中新增的原始数据类型，Symbol提供一种独一无二的值 比如：在js中声明一个变量a = 5;再声明一个变量b = 5; 虽然这两个变量名不同，但是值是相等的；使用Symbol声明的值不重复、不相等。...
为已有对象添加iterator遍历器属性
许珊珊同学的专栏
09-23 270
let obj = { // 已有对象 name: 'xss' age: 23 }; // 开始 obj[Symbol.iterator] = function(){ let iterator = {next: next}; let current = this; const keys = Object.keys(current); ...
ES6自定义Symbol.iterator的实例-解决死循环问题
心若向阳，无谓悲伤的博客
12-11 1127
今天学习ES6的Symbol属性，顺便分享一个Symbol.iterator的实例： 这是一个用于输出下标为偶数位数值的遍历方法，但是发现这样写以后，直接进入死循环，浏览器都卡死了 //自定义Symbol的迭代器Symbol.iterator var arr1 = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16]; //自定义遍历器，输出index为偶数的数...
【JS】for in和for of的前世今生，从Symbol和Iterator讲起
Lazarus_lan的博客
12-04 484
本文主要通过Symbol和Iterator层层递进，对for of 和 for in进行了解释和说明，Symbol和Iterator基础好的同学，可以直接跳到第三节
Symbol(Symbol.iterator)
09-06
Symbol(Symbol.iterator)是一个内置的Symbol符号，它被用于定义一个对象的默认迭代器。迭代器是一种用于遍历数据结构的机制，它提供了一种统一的方式来访问和处理序列中的元素。使用Symbol(Symbol.iterator)可以创建一个迭代器对象，该对象可以被用于在循环中遍历可迭代的对象，比如数组和字符串。通过在对象上定义Symbol(Symbol.iterator)属性并返回一个实现了next()方法的迭代器对象，我们可以使用for...of循环来遍历该对象的元素。例如： ``` const myArray = [1, 2, 3]; const iterator = myArray(); for (const element of iterator) { console.log(element); } // 输出: // 1 // 2 // 3 ``` 上述代码中，我们通过访问数组的Symbol(Symbol.iterator)属性来获取一个迭代器对象，并将其存储在变量iterator中。然后，我们使用for...of循环来遍历该迭代器对象，从而遍历数组中的元素并输出它们。这个内置的Symbol符号Symbol(Symbol.iterator)使得我们可以很方便地使用for...of循环来遍历各种可迭代的对象。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* [Symbol.Iterator简单理解](https://blog.csdn.net/m0_46525076/article/details/118632890)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatgptT3_2"}}] [.reference_item style="max-width: 50%"] - *3* [详解ES6 Symbol 的用途](https://download.csdn.net/download/weixin_38677234/14815893)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatgptT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值