javascript
文章平均质量分 72
hello_dashen
这个作者很懒,什么都没留下…
展开
-
面向对象游戏案例:贪吃蛇
功能实现搭建页面放一个容器盛放游戏场景 div#map,设置样式#map { width: 800px; height: 600px; background-color: #ccc; position: relative;}分析对象游戏对象蛇对象食物对象创建食物对象Food属性xywidthheightcolor方法render 随机创建一个食物对象,并输出到map上创建Food的构造函数,并设置属性v原创 2022-02-18 15:55:48 · 227 阅读 · 0 评论 -
reduce()
JS数组reduce()方法详解及高级技巧reduce()方法可以搞定的东西,for循环,或者forEach方法有时候也可以搞定,那为啥要用reduce()?这个问题,之前我也想过,要说原因还真找不到,唯一能找到的是:通往成功的道路有很多,但是总有一条路是最捷径的,亦或许reduce()逼格更高…1、语法arr.reduce(callback,[initialValue])reduce 为数组中的每一个元素依次执行回调函数,不包括数组中被删除或从未被赋值的元素,接受四个参数:初始值(或者上一次转载 2021-06-07 14:47:21 · 61 阅读 · 0 评论 -
用js实现模糊查询
4种方法测试数据:var list1 = [ { name: "bbAhhhaia", other: "akka" }, { name: "哈哈ad", other: "cai" }, { name: "js", other: "aa" } ] fuzzyQuery(list1, "a");1 indexOf从头到尾地检索字符串 item.name,看它是否含有子串 ke原创 2021-04-14 16:40:28 · 3410 阅读 · 0 评论 -
[].concat.apply([], arguments)
[].concat.apply([], arguments)concat() 方法用于连接两个或多个数组。该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。var a = [1,[2,3]];console.log([].concat(a)) // [1,[2,3]]// 利用apply扁平化数组console.log([].concat.apply([],a)) // [1, 2, 3]var obj = { 0: 3, 1: 4, length: 2}// 利原创 2021-04-09 14:07:54 · 732 阅读 · 0 评论 -
[].slice.call()与Array.prototype.slice.call()
[].slice.call()与Array.prototype.slice.call()将类数组转化为真正的数组在ES6以前,将一个伪数组转换为真正数组通常情况下都是使用[ ].slice.call()方法补充:ES6的方法为 Array.from()1、区别[].slice === Array.prototype.slice // true[]为创建数组,当[].slice的时候,自然会去找原型链[].__proto__.slice === Array.prototype.slic原创 2021-04-08 14:58:32 · 356 阅读 · 0 评论 -
渡一js视频笔记
1. 浏览器1.1 语言类型编译性语言 c c++优点: 快, 写完后才整体翻译成一个文件缺点: 不跨平台解释性语言 javascript php优点: 跨平台,不需要编译成文件,写一行编译一行;单线程缺点: 稍慢.java — javac — 编译 — .class — jvm虚拟机 — 解释执行java不属于两种语言中的任一种,是 oak 语言1.2 主流浏览器及内核IE tridentc原创 2021-03-29 14:16:21 · 727 阅读 · 0 评论 -
javascript - DOM操作1:获取页面元素
根据id获取元素 getElementByIddocument.getElementById('id名')获取到的数据类型 HTMLDivElement,对象都是有类型的注意:由于id名具有唯一性,部分浏览器支持直接使用id名访问元素,但不是标准方式,不推荐使用。根据标签名获取元素 getElementsByTagNamedocument.getElementsByTagName('div') 返回值 HTMLCollection(426) [div#csdn-toolbar, div.toolb原创 2019-06-02 11:43:13 · 397 阅读 · 0 评论 -
javascript - DOM
DOM的概念文档对象模型(Document Object Model,简称DOM),是W3C组织推荐的处理可扩展标志语言的标准编程接口。在网页上,组织页面(或文档)的对象被组织在一个树形结构中,用来表示文档中对象的标准模型就称为DOM。DOM又称为文档树模型文档:一个网页可以称为文档节点:网页中的所有内容都是节点(标签、属性、文本、注释等)元素:网页中的标签属性:标签的属性DOM经常进行的操作获取元素动态创建元素对元素进行操作(设置其属性或调用其方法)事件(什么时机做相应的操作原创 2019-06-02 11:42:36 · 180 阅读 · 0 评论 -
javascript - BOM
BOM的概念BOM (Browser Object Model) 是指浏览器对象模型,浏览器对象模型提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。BOM由多个对象组成,其中代表浏览器窗口的Window 对象是BOM的顶层对象,其他对象都是该对象的子对象。我们在浏览器中的一些操作都可以使用BOM的方式进行编程处理,比如:刷新浏览器、后退、前进、在浏览器中输入URL等BOM的顶级对象windowwindow是浏览器的顶级对象,当调用window下的属性和方法时,可以省略window注意:wi原创 2019-06-02 11:40:58 · 180 阅读 · 0 评论 -
javascript 内置对象
内置对象JavaScript中的对象分为3种:内置对象、浏览器对象、自定义对象JavaScript 提供多个内置对象:Math/Array/Number/String/Boolean…对象只是带有属性和方法的特殊数据类型。可以通过MDN/W3C来查询MDNMozilla 开发者网络(MDN)提供有关开放网络技术(Open Web)的信息,包括 HTML、CSS 和万维网及 HTML5 应用的 API。如何学习一个方法?方法的功能参数的意义和类型返回值意义和类型demo进行测试Da原创 2019-06-02 11:35:58 · 278 阅读 · 0 评论 -
javascript - DOM操作4:事件
DOM操作4:事件事件三要素事件源:触发(被)事件的元素事件类型:事件的触发方式(例如鼠标点击或键盘点击)事件处理程序:事件触发后要执行的代码(函数形式)事件的基本使用var box = document.getElementById('box');box.onclick = function() { console.log('代码会在box被点击后执行'); };事件详解注册/移除事件的三种方式var box = document.getElementById('box'原创 2019-06-02 11:43:42 · 72 阅读 · 0 评论 -
javascript DOM操作3:属性操作、节点操作
DOM操作3:属性操作非表单元素的属性href、title、id、src、classNamevar link = document.getElementById('link');console.log(link.href);console.log(link.title);var pic = document.getElementById('pic');console.log(pic.src);innerHTML 和 innerTextvar box = document.getEl原创 2019-06-03 08:58:54 · 129 阅读 · 0 评论 -
javascript - DOM操作2:创建元素
DOM操作2:创建元素三种方式document.write()document.write('新设置的内容<p>标签也可以生成</p>');innerHTMLvar box = document.getElementById('box');box.innerHTML = '新内容<p>新标签</p>';document.createElement()var div = document.createElement('div');docum原创 2019-06-03 08:59:39 · 126 阅读 · 0 评论 -
javascript - 偏移量、客户区大小、滚动偏移
偏移量offsetParent用于获取定位的父级元素offsetParent和parentNode的区别var box = document.getElementById('box');console.log(box.offsetParent);console.log(box.offsetLeft);console.log(box.offsetTop);console.log(box.offsetWidth);console.log(box.offsetHeight);客户区大小原创 2019-06-03 09:03:39 · 205 阅读 · 0 评论 -
字符串分割与数组的分割与删除 split(),splice(),slice(),delete()
字符串分割与数组的分割与删除 split(),splice(),slice(),delete()一、作用对象1、split()方法是对字符串的操作;splice()和slice()是对数组的操作。slice()也可用于字符串。二、参数1、split(separator,howmany) 参数有两个 sepatator为必选项,表示分割字符串的符号如“,”,“:”,”|“等。howmany为...原创 2019-06-04 22:59:02 · 2026 阅读 · 0 评论 -
javascript 简单类型、复杂类型
简单类型和复杂类型的区别基本类型又叫做值类型,复杂类型又叫做引用类型值类型:简单数据类型,基本数据类型,在存储时,变量中存储的是值本身,因此叫做值类型。引用类型:复杂数据类型,在存储时,变量中存储的仅仅是地址(引用),因此叫做引用数据类型。堆和栈堆栈空间分配区别: 1、栈(操作系统): 由操作系统自动分配释放,存放函数的参数值,局部变量的值等。其操作方式类似于数据结构中的栈; 2、堆(操作系统): 存储复杂类型(对象),一般由程序员分配释放,若程序员不释放,由垃圾回收机制回收,分配原创 2019-06-02 11:35:05 · 87 阅读 · 0 评论 -
javascript预解析
预解析JavaScript代码的执行是由浏览器中的JavaScript解析器来执行的。JavaScript解析器执行JavaScript代码的时候,分为两个过程:预解析过程和代码执行过程预解析过程:把变量的声明提升到当前作用域的最前面,只会提升声明,不会提升赋值。把函数的声明提升到当前作用域的最前面,只会提升声明,不会提升调用。先提升var,再提升functionJavaScript的执行过程var a = 25;function abc () { alert(a); /原创 2019-06-02 11:29:19 · 162 阅读 · 0 评论 -
JavaScript 面向对象编程、原型
面向对象介绍什么是面向对象面向对象不是新的东西,它只是过程式代码的一种高度封装,目的在于提高代码的开发效率和可维护性。面向对象编程 —— Object Oriented Programming,简称 OOP ,是一种编程开发思想。它将真实世界各种复杂的关系,抽象为一个个对象,然后由对象之间的分工与合作,完成对真实世界的模拟。在面向对象程序开发思想中,每一个对象都是功能中心,具有明确分工,可以完成接受信息、处理数据、发出信息等任务。因此,面向对象编程具有灵活、代码可复用、高度模块化等特点,容易原创 2019-05-31 15:53:26 · 97 阅读 · 0 评论 -
javascript继承
构造函数的属性继承:借用构造函数function Person (name, age) { this.type = 'human' this.name = name this.age = age}function Student (name, age) { // 借用构造函数继承属性成员 Person.call(this, name, age)}var s1 = Student('张三', 18)console.log(s1.type, s1.name, s1.age)原创 2019-05-31 15:55:06 · 61 阅读 · 0 评论 -
正则表达式
正则表达式正则表达式简介什么是正则表达式正则表达式:用于匹配规律规则的表达式正则表通常被用来 检索、替换 那些符合某个模式(规则)的文本。正则表达式是对字符串操作的一种逻辑公式,就是用事先定义好的一些特定字符、及这些特定字符的组合,组成一个“规则字符串”,这个“规则字符串”用来表达对字符串的一种过滤逻辑。正则表达式的作用给定的字符串是否符合正则表达式的过滤逻辑 (匹配)可以通过正则表达式,从字符串中获取我们想要的特定部分 (提取)强大的字符串替换能力 (替换)正则表达式的特点原创 2019-05-31 15:57:40 · 69 阅读 · 0 评论 -
JavaScript伪数组和数组
伪数组和数组在JavaScript中,除了5种原始数据类型之外,其他所有的都是对象,包括函数(Function)。对象与数组的关系说区别之前,需要先提到另外一个知识,就是 JavaScript 的原型继承。所有 JavaScript 的内置构造函数都是继承自 Object.prototype 。在这个前提下,可以理解为使用 new Array() 或 [] 创建出来的数组对象,都会拥有 Object.prototype 的属性值。var obj = {};// 拥有 Object.prototy原创 2019-05-31 15:59:33 · 582 阅读 · 0 评论 -
javascript变量
什么是变量什么是变量变量是计算机内存中存储数据的标识符,根据变量名称可以获取到内存中存储的数据为什么要使用变量使用变量可以方便的获取或者修改内存中的数据变量的命名规则和规范规则 - 必须遵守的,不遵守会报错由字母、数字、下划线、$符号组成,不能以数字开头不能是关键字和保留字,例如:for、while。区分大小写规范 - 建议遵守的,不遵守不会报错变量名必须有意义遵守驼峰命名法。首字母小写,后面单词的首字母需要大写。例如:userName、user原创 2019-06-01 14:49:42 · 63 阅读 · 0 评论 -
javascript 数据类型
数据类型简单数据类型Number、String、Boolean、Undefined、Null、Symbol、BigIntNumber类型数值范围最小值:Number.MIN_VALUE,这个值为: 5e-324最大值:Number.MAX_VALUE,这个值为: 1.7976931348623157e+308无穷大:Infinity无穷小:-Infinity数值判断NaN:not a numberNaN 与任何值都不相等,包括他本身isNaN: is not a n原创 2019-06-01 14:51:31 · 94 阅读 · 0 评论 -
javascript a++, ++a、 switch语句
运算++a:先加1,后参与运算a++:先参与运算,后加1--a:先减1,后参与运算a--:先参与运算,后减1var a = 1; var b = ++a + ++a; console.log(a, b); // 3, 5 var a = 1; var b = a++ + ++a; console.log(a, b); // 3, 4 var a = 1; var b = a++ + a++; console.log(a, b); // 3, 3 var a = 1; var b =原创 2019-06-01 14:54:20 · 183 阅读 · 0 评论 -
javascript循环结构
循环结构在javascript中,循环语句有三种,while、do…while、for循环。while语句基本语法:// 当循环条件为true时,执行循环体;当循环条件为false时,结束循环。while (循环条件) { //循环体}do…while语句do…while循环和while循环非常像,二者经常可以相互替代,但是do…while的特点是不管条件成不成立,都会执行一次。基础语法:do { // 循环体;} while (循环条件);for语句whil原创 2019-06-01 14:57:25 · 310 阅读 · 0 评论 -
javascript 函数
函数的定义方式函数声明 function foo () {}函数表达式 var foo = function () {}new Function函数声明与函数表达式的区别函数声明必须有名字函数声明会函数提升,在预解析阶段就已创建,声明前后都可以调用函数表达式类似于变量赋值函数表达式可以没有名字,例如 匿名函数函数表达式没有变量提升,在执行阶段创建,必须在表达式执行之后才可以调用下面是一个根据条件定义函数的例子: ???if (true) { fu原创 2019-06-01 15:02:05 · 263 阅读 · 0 评论 -
javascript作用域
作用域作用域:变量可以起作用的范围全局变量和局部变量全局变量在任何地方都可以访问到的变量就是全局变量,对应全局作用域局部变量只在固定的代码片段内可访问到的变量,最常见的例如函数内部, 对应局部作用域(函数作用域)不使用 var 声明的变量是全局变量,不推荐使用。变量退出作用域之后会销毁,全局变量关闭网页或浏览器才会销毁块级作用域任何一对花括号({和})中的语句集都属于一个块,在这之中定义的所有变量在代码块外都是不可见的,我们称之为块级作用域。在es5之前没有块级作用域的概原创 2019-06-02 11:28:28 · 167 阅读 · 0 评论 -
javascript是什么
JavaScript 是什么解析执行:轻量级解释型的,或是 JIT 编译型的程序设计语言语言特点:动态,头等函数 (First-class Function)又称函数是 JavaScript 中的一等公民执行环境:在宿主环境(host environment)下运行,浏览器是最常见的 JavaScript 宿主环境但是在很多非浏览器环境中也使用 JavaScript ,例如 node.js编程范式:基于原型、多范式的动态脚本语言,并且支持面向对象、命令式和声明式(如:函数式编程)编原创 2019-05-31 15:51:33 · 154 阅读 · 0 评论