《JavaScript 闯关记》之数组

《JavaScript 闯关记》

为何写作此课程 stone 主要负责基于 Web 的企业内部管理系统的开发,虽然能够熟练地使用 JavaScript,但随着对 JavaScript 的理解越来越深,才发现自己尚未掌握其精髓. 2015年,公司请来大胡子姜志辉为我们培训 JS Dota 课程,让我对 JavaScript 有了全新的认识,他一步步引导我们手写 jQuery.Backbone 等 JavaScript 主流框架,更是激发了我对 JavaScript 浓厚的兴趣. 俗话说「教是最好的学」,我是公司的兼职教员,正好…

《JavaScript闯关记》视频版硬广

<JavaScript闯关记>视频版硬广 stone 在菜航工作时,兼任内部培训讲师,主要负责 JavaScript 基础培训,2016年整理的<JavaScript闯关记>课程在 github 上收获了近 1000 的 star,帮助了很多同学在学习 JavaScript 的道路上由浅入深. 但由于文字的表达力有限,很多技术细节.编码技巧.思维方式无法准确的传递给大家.故跟极客学院合作,把<JavaScript闯关记>中部分较难的知识点录制成视频,便于大家更好的理…

《JavaScript 闯关记》之数组

数组是值的有序集合.每个值叫做一个元素,而每个元素在数组中有一个位置,以数字表示,称为索引. JavaScript 数组是无类型的,数组元素可以是任意类型,并且同一个数组中的不同元素也可能有不同的类型.数组的元素甚至也可能是对象或其他数组. JavaScript数组是动态的,根据需要它们会增长或缩减,并且在创建数组时无须声明一个固定的大小或者在数组大小变化时无须重新分配空间. JavaScript 数组可能是稀疏的,数组元素的索引不一定要连续的,它们之间可以有空缺.每个JavaScript数组都…

JavaScript 闯关记

DOM(文档对象模型)是针对 HTML 和 XML 文档的一个 API.DOM 描绘了一个层次化的节点树,允许开发人员添加.移除和修改页面的某一部分. 节点层次 DOM 可以将任何 HTML 或 XML 文档描绘成一个由多层节点构成的结构.节点分为几种不同的类型,每种类型分别表示文档中不同的信息及(或)标记.每个节点都拥有各自的特点.数据和方法,另外也与其他节点存在某种关系.节点之间的关系构成了层次,而所有页面标记则表现为一个以特定节点为根节点的树形结构.以下面的 HTML 为例: <html>…

《JavaScript 闯关记》之垃圾回收和内存管理

JavaScript 具有自动垃圾收集机制(GC:Garbage Collecation),也就是说,执行环境会负责管理代码执行过程中使用的内存.而在 C 和 C++ 之类的语言中,开发人员的一项基本任务就是手工跟踪内存的使用情况,这是造成许多问题的一个根源. 在编写 JavaScript 程序时,开发人员不用再关心内存使用问题,所需内存的分配以及无用内存的回收完全实现了自动管理.这种垃圾收集机制的原理其实很简单:找出那些不再继续使用的变量,然后释放其占用的内存.为此,垃圾收集器会按照固定的时间…

《JavaScript 闯关记》之原型及原型链

原型链是一种机制,指的是 JavaScript 每个对象都有一个内置的 __proto__ 属性指向创建它的构造函数的 prototype(原型)属性.原型链的作用是为了实现对象的继承,要理解原型链,需要先从函数对象.constructor.new.prototype.__proto__ 这五个概念入手. 函数对象前面讲过,在 JavaScript 里,函数即对象,程序可以随意操控它们.比如,可以把函数赋值给变量,或者作为参数传递给其他函数,也可以给它们设置属性,甚至调用它们的方法.下面示例代…

《JavaScript 闯关记》之 DOM（上）

《JavaScript 闯关记》之单体内置对象

ECMA-262 对内置对象的定义是「由 JavaScript 实现提供的.不依赖于宿主环境的对象,这些对象在 JavaScript 程序执行之前就已经存在了」.意思就是说,开发人员不必显式地实例化内置对象,因为它们已经实例化了.前面我们已经介绍了大多数内置对象,例如 Object.Array 和 String.ECMA-262 还定义了两个单体内置对象:Global 和 Math. Global 对象 Global 对象可以说是 JavaScript 中最特别的一个对象了,因为不管你从什么角度…

《JavaScript 闯关记》之基本包装类型

为了便于操作基本类型值,JavaScript 还提供了3个特殊的引用类型:Boolean.Number 和 String.实际上,每当读取一个基本类型值的时候,后台就会创建一个对应的基本包装类型的对象,从而让我们能够调用一些方法来操作这些数据.来看下面的例子. var s1 = "some text"; var s2 = s1.substring(2); 这个例子中的变量 s1 包含一个字符串,字符串当然是基本类型值.而下一行调用了 s1 的 substring() 方法,并将返回的结…

《JavaScript 闯关记》之正则表达式

由于本课程的核心是 JavaScript,所以本文着重讲解了「正则表达式」在 JavaScript 中的用法,并未深入「正则表达式」的具体细节.如果您尚不了解「正则表达式」,强烈推荐您先学习正则表达式30分钟入门教程 http://deerchao.net/tutorials/regex/regex.htm 之后,再进行本课程的学习. 正则表达式(regular expression)是一个描述字符模式的对象,使用正则表达式可以进行强大的模式匹配和文本检索与替换功能.JavaScript 的正…

《JavaScript 闯关记》之函数

函数是一段代码,它只定义一次,但可以被执行或调用任意次.在 JavaScript 里,函数即对象,程序可以随意操控它们.比如,可以把函数赋值给变量,或者作为参数传递给其他函数,也可以给它们设置属性,甚至调用它们的方法.如果函数挂载在一个对象上,作为对象的一个属性,就称它为对象的方法.如果函数嵌套在其他函数中定义,这样它们就可以访问它们被定义时所处的作用域中的任何变量. 函数定义在 JavaScript 中,函数实际上是对象,每个函数都是 Function 构造函数的实例,因此函数名实际上也是一…

《JavaScript 闯关记》之对象

对象是 JavaScript 的数据类型.它将很多值(原始值或者其他对象)聚合在一起,可通过名字访问这些值,因此我们可以把它看成是从字符串到值的映射.对象是动态的,可以随时新增和删除自有属性.对象除了可以保持自有的属性,还可以从一个称为原型的对象继承属性,这种「原型式继承(prototypal inheritance)」是 JavaScript 的核心特征. 对象最常见的用法是创建(create).设置(set).查找(query).删除(delete).检测(test)和枚举(enumerat…

《JavaScript 闯关记》之表达式和运算符

表达式表达式是由数字.运算符.数字分组符号(如括号).自由变量和约束变量等以能求得数值的有意义排列方法所得的组合.JavaScript 表达式主要有以下几种形式: 原始表达式:常量.变量.保留字. 对象.数组初始化表达式:var obj={a:1,b:2};,var arr=[1,2,3];. 函数定义表达式:var fn=function(){}. 属性访问表达式:Math.abs. 调用表达式:alert('hello');. 对象创建表达式:new object();. 运算符 Java…

《JavaScript 闯关记》之语法

JavaScript 的语法大量借鉴了 C 及其他类 C 语言(如 Java 和 Perl)的语法.因此,熟悉这些语言的开发人员在接受 JavaScript 更加宽松的语法时,一定会有种轻松自在的感觉.本章主要按照 ECMAScript 3 介绍这门语言的基本概念,并就 ECMAScript 5 的变化给出说明. 字符集 JavaScript 程序是用 Unicode 字符集编写的,Unicode 是 ASCII 和 Latin-1 的超集,并支持地球上几乎所有在用的语言.ECMAScript…

《JavaScript 闯关记》之作用域和闭包

作用域和闭包是 JavaScript 最重要的概念之一,想要进一步学习 JavaScript,就必须理解 JavaScript 作用域和闭包的工作原理. 作用域任何程序设计语言都有作用域的概念,简单的说,作用域就是变量与函数的可访问范围,即作用域控制着变量与函数的可见性和生命周期.在 JavaScript 中,变量的作用域有全局作用域和局部作用域两种. 全局作用域(Global Scope) 在代码中任何地方都能访问到的对象拥有全局作用域,一般来说以下三种情形拥有全局作用域: 最外层函数和在最…

《JavaScript 闯关记》之事件

JavaScript 程序采用了异步事件驱动编程模型.在这种程序设计风格下,当文档.浏览器.元素或与之相关的对象发生某些有趣的事情时,Web 浏览器就会产生事件(event).例如,当 Web 浏览器加载完文档.用户把鼠标指针移到超链接上或敲击键盘时,Web 浏览器都会产生事件.如果 JavaScript 应用程序关注特定类型的事件,那么它可以注册当这类事件发生时要调用的一个或多个函数.请注意,这种风格并不只应用于 Web 编程,所有使用图形用户界面的应用程序都采用了它,它们静待某些事情发生(即…

《JavaScript 闯关记》之 DOM（下）

Element 类型除了 Document 类型之外,Element 类型就要算是 Web 编程中最常用的类型了.Element 类型用于表现 XML 或 HTML 元素,提供了对元素标签名.子节点及特性的访问.Element 节点具有以下特征: nodeType 的值为1: nodeName 的值为元素的标签名: nodeValue 的值为 null: parentNode 可能是 Document 或 Element: 其子节点可能是 Element.Text.Comment.Proces…

《JavaScript 闯关记》之 BOM

ECMAScript 是 JavaScript 的核心,但如果要在 Web 中使用 JavaScript,那么 BOM(浏览器对象模型)则无疑才是真正的核心.BOM 提供了很多对象,用于访问浏览器的功能,这些功能与任何网页内容无关.多年来,缺少事实上的规范导致 BOM 有很多问题,因为浏览器提供商会按照各自的想法随意去扩展它.W3C 为了把浏览器中 JavaScript 最基本的部分标准化,已经将 BOM 的主要方面纳入了 HTML5 的规范中. window 对象 BOM 的核心对象是 win…

《JavaScript 闯关记》之语句

表达式在 JavaScript 中是短语,那么语句就是整句命令.表达式用来计算出一个值,语句用来执行以使某件事发生.从本质上看,语句定义了 JavaScript 中的主要语法,语句通常使用一或多个关键字来完成给定任务.语句可以很简单,例如通知函数退出:也可以比较复杂,例如指定重复执行某个命令的次数.下表列出了 JavaScript 大部分语句的语法和用途: 语句语法用途 break break [label]; 退出最内层循环或者退出 switch 语句,又或者退出 label 指定的语句…

《JavaScript 闯关记》之变量和数据类型

当程序需要将值保存起来以备将来使用时,便将其赋值给一个变量,值的类型称作数据类型. 变量 JavaScript 的变量是松散类型的,所谓松散类型就是可以用来保存任何类型的数据.换句话说,每个变量仅仅是一个用于保存值的占位符而已.定义变量时要使用关键字 var 来声明的,如下所示: var message; 这行代码定义了一个名为 message 的变量,该变量可以用来保存任何值(像这样未经过初始化的变量,会保存一个特殊的值 undefined).JavaScript 也支持直接初始化变量,因此在…

《JavaScript 闯关记》之初探

当学习一门新的编程语言的时候,应该边学边做,反复演练以加深理解.因此,你需要一个 JavaScript 解释器.幸运的是,每一个 Web 浏览器都包含一个 JavaScript 解释器. 可以通过在 HTML 文件里写一个 <script> 元素来嵌入 JavaScript 代码,当浏览器加载 HTML 文件的时候,它会自动执行这段代码.如果运行的是一小段 JavaScript 代码,则不必每次都这样做.我们可以利用 Chrome 浏览器的「开发者工具」来运行这些小段代码,通常按 F12 或者…

《JavaScript 闯关记》之简介

简介 JavaScript 是面向 Web 的编程语言,绝大多数现代网站都使用了 JavaScript,并且所有的现代 Web 浏览器(电脑,手机,平板)均包含了 JavaScript 解释器. 这使得 JavaScript 能够称得上史上使用最广泛的编程语言. JavaScript 也是前端开发工程师必须掌握的三种技能之一:描述网页内容的 HTML.描述网页样式的 CSS.以及描述网页行为的 JavaScript. JavaScript 是一门动态的.弱类型的.面向对象的.解释型的编程语言…

W3CSchool实战闯关笔记（JavaScript）

//handsome /** *ugly **/ 第一关注释 // 举例 var myName; // Define myName below this line 第二关声明变量 // Setup var a; var b = 2; // Only change code below this line var a = 7; var b = a; 第三关变量赋值 // 举例 var ourVar = 19; // Only change code below this line var a =…

淘宝ued - 前端智勇大闯关(第三季)答案(更新)

淘宝ued - 前端智勇大闯关(第三季)答案(更新) 下午在微博上看到了淘宝智勇大闯关第三季的信息,感觉挺有意思的,于是就尝试做了下.附上题目地址: http://ued.campus.alibaba.com/quiz3/index.php 也可到独立博客查看:前端智勇大闯关(第三季)答案第1题突破,带锁的门方法1 这题相对比较简单,查看源码即可看到提示信息: 1 <!-- 2 -==================================== 3 - 调用powder.blow(…

XSS Challenges闯关笔记

前言做xss做疯了再来一个. 地址:https://xss-quiz.int21h.jp/ ,这个貌似是日本的一个安全研究员yamagata21做的. 做到第九关就跪了,而总共有二十关.一半都还没有,实在是惭愧.第九关考的是utf-7编码绕过实体编码的问题,但是我在最新的chrome和firefox都不能复现.查了好一会资料才发现,utf-7 bom xss是用来bypass ie 7的. 这.... 又因为这个挑战后面的关卡,貌似必须得过了前面的关卡才能通关.所以,只好做到这里了,先做个记录…

某xss挑战赛闯关笔记

0x0 前言在sec-news发现先知上师傅monika发了一个xss挑战赛的闯关wp([巨人肩膀上的矮子]XSS挑战之旅---游戏通关攻略(更新至18关)https://xianzhi.aliyun.com/forum/read/1462.html),去看了一下发现是前几天刚发现的平台,看了一下那个绕狗教程感觉挺不错的,xss却没有玩,那么正巧就玩一下,顺便学习一波别的师傅的思路. http://xss.tv 闯关地址:http://test.xss.tv 自己做了一些,也看了一下先知mon…

XSS闯关游戏准备阶段及XSS构造方法

请下载好XSS闯关文件后,解压后放在服务器的对应文件夹即可在该闯关中,会在网页提示一个payload数值 payload,翻译过来是有效载荷通常在传输数据时,为了使数据传输更可靠,要把原始数据分批传输,并且在每一批数据的头和尾都加上一定的辅助信息,比如数据量的大小.校验位等,这样就相当于给已经分批的原始数据加一些外套,这些外套起标示作用,使得原始数据不易丢失,一批数据加上“外套”就形成了传输通道的基本传输单元,叫做数据帧或数据包,而其中的原始数据就是payload payload指安全测试数…

CTFhub-WEB前置-http协议闯关

前情提要: 在渗透学习过程中,web的基础知识很重要,在这里通过long long ago之前学习的http基础,并结合网上的CTFhub--WEB前置之http协议闯关,对web基础知识进行加固并查漏补缺:本篇结合CTFhub-http协议闯关加上web基础. 一.基础知识介绍 A.客户端的基本概念和常规的主要分类科普一下:客户端(client)是指与服务器相对应,为客户提供本地服务的程序在WEB中,常见的网络架构为B/S和C/S两种:经常在我们生活中出现的就是B/S B/S[浏览器/服务…

网页闯关游戏(riddle webgame)--H5刮刮卡的原理和实践

前言: 之前编写了一个网页闯关游戏(类似Riddle Game), 除了希望大家能够体验一下我的游戏外. 也愿意分享编写这个网页游戏过程中, 学到的一些知识. 对于刮刮卡, 想必大家都很熟悉, 也很喜欢这种方式. 你可能会很好奇, 它是如何实现的呢? 本文将阐述其原理, 并结合具体实例来演示如何借助H5的canvas来实现类刮刮卡的效果. 展示效果: 网页闯关游戏入口(请狠狠地点击我, ^_^) http://magic.mmxfgame.com. H5刮刮卡的实例源自第六关--拜访东方不败的故…

网页闯关游戏(riddle webgame)--SQL注入的潘多拉魔盒

前言: 之前编写了一个网页闯关游戏(类似Riddle Game), 除了希望大家能够体验一下我的游戏外. 也愿意分享编写这个网页游戏过程中, 学到的一些知识. web开发初学者往往会忽视一些常见的漏洞, 比如SQL注入攻击, XSS攻击. 本文将简述SQL注入攻击的原理, 并分享下关卡设计, 其在打开潘多拉魔盒的情况下, 又能很好地限制危害. 效果展示: 先打下广告: 网页闯关游戏入口(请狠狠地点击我, ^_^). 本文的想法实施于第十一关--健忘的教授. 很直接的呈现一个登陆对话框, 考验玩家…

【《JavaScript 闯关记》之数组】的更多相关文章