い南秋乱港

原型定义：​ 原型是function对象的一个属性，它定义了构造函数制造出的对象的公共祖先。通过该构造函数产生的对象，可以继承该原型的属性和方法。原型也是对象。// Animal.prototype --原型// Animal.prototype = {} 是祖先Animal.prototype.Type = "mammal";function Animal() {}var dog = new Animal();var cat = new Animal();//控制台输

命名空间作用：​ 管理变量，防止污染全局，适用于模块化开发。老版本的命名空间（对象解决命名空间）var org = { department1 : { wangjie : { name : "abc", age : 123 }, liangyunhu : { } }, department2 : { zhangsan : { },

JS 继承模式继承发展史传统形式 ---- 原型链缺点：​ 过多的继承了没用的东西。不太实用。借用构造函数例如使用 call ( ) / apply ( ) 设置this的指向，来达到借用其他构造函数中的方法的目的。形似继承，实则不是缺点：​ 不能继承借用的构造函数的原型​ 每次构造函数都要多执行函数，因为使用call/apply时，被借用的构造函数也会执行。共有原型Father.prototype.lastName = "deng";function Fa

构造函数例：var animal = new Object()animal.name = "阿虎";animal.sex = "male";//构造函数并不是一定为Object(),可以自己写构造函数，但是要遵循大驼峰规则，方便辨认function FoodList() { this.name = "meat"; this.color = "red"; this.money = 100; this.top = function () { thi

call（） / apply（）作用​ 修改this的指向。call（）​ 任何方法后都可以加 .call( )//效果相同test() ----> test.call() ​ 当 call( ) 括号中有参数时，他会将前面的方法中的所有的this指向都修改为括号中的第一个参数。其余参数作为实参传入。//使用call()借用别人的函数，完成自己的功能。function Person(name, age){ //this == obj this.name =

JS闭包相关要点内存泄漏过多的占用系统内存的行为，相当于攥着一团湿毛巾，流失的水越多，剩余的水越少，相当于内存剩余越少。何为功能一个真正的功能不应该依赖于外部的东西，自己本身就应该能独立完成这个事儿，这样的功能才是一个真正完整的功能。例：//一个简易累加器var count = 0;function test(){ count ++; console.log(count);}test();test();test();//输出123//该功能依赖

面向对象中的重点概念注:JS推荐 在创建构造函数时, 在构造函数里只写不同的属性或者方法, 公共的属性或者方法不要写到构造函数里, 而是写给构造函数的原型对象!!!本文举例所用构造函数：function Student(name, age, sex) { this.name = name; this.age = age; this.sex = sex; };}var stu1 = new Student("张三", 20, "男");var stu2 = ne

面向对象面向过程和面向对象对比面向过程编程(OPP): 以事件为中心, 侧重于完成整个需求所需的步骤代表语言:C语言面向对象编程(OOP): 以事物为中心, 侧重于完成整个需求的事物的特征和行为代表语言: Java, Objective-C, C++举例： 把大象装冰箱面向过程的思路：把冰箱门打开把大象装进去把冰箱门关上面向对象的思路：大象:(特征/属性:重量, 尺寸… ;行为/方法:走, 吃, 睡, 跑, 打架… )冰箱:(特征/属性:品牌, 价格, 颜色,

js书写位置script标签 并不是只能写到body里面的最后面, 也可以写到head里或者其他位置如果script标签里有操作当前文档dom的代码, 且这些代码可能先于html元素的代码执行. 此时, script标签要写到body里面的最后面; 除此之外的script标签可以放到其他地方文档加载事件load事件这是js提供的原生文档加载事件, 该事件会在整个文档加载完毕之后触发window.onload = function(){console.log(document.getEl

Localstorage基础H5新增特性作用：本地存储, 解决了cookie存储空间不足的问题​ cookie中每条cookie的存储空间只有4k，localStorage一般支持5M, 不同浏览器里localStorage可能会有不同优点：拓展了cookie的4k的限制localStorage就相当于前端的5M的数据库劣势：浏览器的大小不统一, 并且在IE8以上的浏览器才支持localStorage存储的数据的类型 默认都会转成string, 以后我们如果要存储复杂的数据结

正则表达式h5给input新增了pattern属性, 用户直接传入正则规则对输入框的数据进行判断, 只适用于 type值为 text, password, url, email, search, tel值得input还可以配合title属性 来给用户提醒以帮助用户<form action="javascript:void(0)" method="post"> <input type="text" pattern="[\w]{6}" title="输入内容只能是大小写字母和

Cookie知识点: 数据持久化cookielocalStorage(H5提供的新的数据持久化方案)cookiecookie, 有使用cookies, 这是服务器保存在浏览器端的数据片段, 以键值对(key=value)的形式进行保存, 每次浏览器向客户端发起请求时, 会自动携带cookie 将其传递给服务器; 简单来说, cookie是服务器留给计算机用户浏览器端的小文件(字符串)HTTP协议(超文本传输协议)该协议是一个无状态协议, 每次浏览器向服务器发起请求时, 服务器没

JS 移动端事件源对象:真正触发该事件的源头对象, 最终指向的是html元素。事件是会传播的 —> 事件代理, 利用事件冒泡的特点。box.onclick = function(e){ // 获取事件源对象 事件对象.target var even = e || event; console.log(even.target, this);}移动端优先级较高的事件：来电, 闹铃, 事件提醒移动端常用事件ontouchstart 开始触摸

BOM基础BOM: Borwser Object Model JS的浏览器对象模型, 主要用于客户端浏览器的管理BOM概念比较古老, 但是一直没有被标准化, 不过现在基本上主流浏览器都支持BOM, 也都遵循最基本的规则, W3C也将BOM的主要内容纳入了HTML5的规范BOM 是由一系列的对象组成的, 每个对象负责一类事务而BOM里的核心对象 是 window对象; 该对象既是核心对象也是顶层对象, 其余的对象都是由window延伸出来的由window延伸出来的对象:docu

JS 变量提升机制JS中, 系统会把所有的函数和变量的声明提升到其作用域的最上面这个提升 我们是感知不到的, 可以理解为, 系统"悄悄的"被提升到其作用域的最顶部造成的后果:变量可以先使用, 后声明; 同理, 函数也可以先调用, 再声明注意:变量提升, 提升的只是变量的声明, 其初始化不会被提升函数声明提升时, 函数体本身会被提升到其作用域的最上面, 但是, 函数表达式在执行时则不然, 只会提升变量, 不会提升函数体; 只是变量做提升, 暂时赋值为undefined, 原来赋值的函数和其

事件JS是一门以事件为驱动的脚本语言. 我们想要执行任何逻辑, 都需要借助事件为对应的触发条件.当一个事件被触发后, 系统会收集与该事件有关的所有数据信息, 并自动为我们创建一个 “事件对象”, 该对象里存储了所有与该事件有关的数据. 我们只需要获取既可. 在事件触发的函数里, 直接获取event既可注意: 部分火狐浏览器不支持event对象写法. 想要兼容, 火狐浏览器会把事件对象当做形参赋值给触发函数的第一个参数, 我们只需要在声明事件触发函数的时候给函数添加一个参数即可.例：//

DOM基础续DOM还可以让我们不通过样式 还可以直接获取元素的尺寸和位置以下属性可以帮助我们直接获取元素的尺寸和位置, 可以直接通过DOM元素节点通过点语法获取.尺寸内尺寸clientWidth = width + 左右的paddingclientHeight = height + 上下的padding外尺寸offsetWidth = width + 左右的padding + 左右borderoffsetHeight = height + 上下的padding + 上下bo

DOM基础续操作元素节点的属性通过点语法操作元素的属性 元素.style 元素.src 元素.value 元素.href通过点语法操作元素的属性, 这种写法是兼备读写性的点语法操作元素的属性存在的问题:需要分别到底是读还是写, 因为读写的语法是一样的;有些属性获得值与设置的值不一致. e.g: 元素的src属性;我们在设置属性时, 如果属性名没办法直接通过点语法写出来, 而是间接获取的; 或者需要的属性名是一个字符串. 这些情况都无法使用点语法操作属性.setAttribu

DOM基础DOM: Document Object Model 文档对象模型作用: 用来处理与当前文档内容有关的操作DOM树当HTML文档加载时, 浏览器会根据我们页面里书写的html代码, 创建一个反映元素之间嵌套关系的树状结构. DOM树是由一个个节点组成.注意: DOM树不仅仅 只由HTML元素组成!!!DOM的节点类型有很多, 元素节点只是其中的一种DOM节点的类型:元素节点 声明节点 文本节点 文字内容 空格注释节点文档节点 document

Date日期时间对象Date() 构造函数调用Date构造函数, 我们能得到一个日期时间的date对象, 所有跟日期和时间有关的方法都是该对象的方法new Date()我们得到的是一个日期时刻对象, 这个对象里存储的日期和时间是一个时刻.注意: new Date()获取的是一个本机时刻var date = new Date();获取年份var year = date.getFullYear();获取月份, 月份的表示形式 0-11var month = date.

匿名函数匿名函数: 没有名字的函数我们都使用函数名做哪些事情函数的调用 : 函数名()函数名充当函数体 : 计时器, 绑定事件当我们把匿名函数赋值给一个变量后, 该变量名就可以充当匿名函数的函数名使用TweenJS 动画插件加载方式<script src="js/tween.js" type="text/javascript" charset="utf-8"></script>要想实现tween.js, 首先要明确每个动画函数里的

字符串操作函数substr(start, length) 获取一个字符串中的子串返回值: 截取到的子字符串start: 截取的起始位置, 值可以填负值, 表示从后往前数length: 要截取的长度 可以不写, 如果不写默认截取到最后split(flag, count) 字符串分割返回值: 字符串数组flag: 分割时用的标识符, 充当分隔符的符号, 分割后不会存在count: 规定最终得到的子串个数如果想要将字符串里的每一个符号单独分割出来, flag使用""con

Math 有关方法向下取整console.log(Math.floor(1.9));随机数console.log(Math.random());向上取整console.log(Math.ceil(1.01));四舍五入console.log(Math.round(4.4), Math.round(4.5));绝对值console.log(Math.abs(-4));次方console.log(Math.pow(81, 1/2));开方con

JS 操作元素属性和样式通过点语法, 操作style属性间接操作元素的css样式div1.style.width = "300px";JS里的样式名, 如果出现多个单词, 不再用-链接, 写成驼峰div1.style.backgroundColor = "blue";JS设置的样式, 全部为行间css样式例：随机改变颜色var r = Math.floor(Math.random() * 256);var g = Math.floor(Math.random() * 25

while当不清楚循环次数时,或者不需要考虑循环变量的问题时, 建议考虑while循环语法var i = 0;while (i < 5){ console.log("hello, world!"); i++;}do…while语法var i = 0;do { console.log("hello, world!"); i++;}while(i < 0) do…while和while循环的区别do…whil

分支语句程序运行的三大结构顺序结构: 代码从上到下, 逐行执行, 每行代码执行一遍, 执行完之后执行下一行分支结构: 根据不同的情况, 执行不同的代码循环结构: 重复执行某段代码表达式:由常量, 变量, 运算符组成的式子特点:表达式都有结果, 且我们操作表达式, 都是操作表达式的结果分支语句:if语句switch语句if 语句if语句第一种形式语法：if(条件表达式){​ 代码…}执行原理:如果小括号里的值为真, 执行大括号里的代码;

JavaScript负责页面的行为和动作(交互)组成部分：​ 1. ECMAScript: 基础的语法(常量, 变量, 函数, 循环, 判断…)​ 2. DOM: Document Object Model, 文档对象模型, 处理文档内容有关的方法​ 3. BOM: Browers Object Model, 浏览器对象模型, 描述与浏览器进行交互的方法JavaScript的特点:​ 1. 弱类型, 没有严格的数据类型​ 2. 事件驱

Day-12注：预编译一定是先生成GOCSS属性box-shadow 阴影效果左负右正，上负下正。 box-shadow: inset,/*内外阴影*/ -10px 0px 10px red, /*左边阴影*/ 0px -10px 10px #000, /*上边阴影*/ 10px 0px 10px green, /*右边阴影*/ 0px 10px 10px blue; /*下边阴影*/ 参数详

Day-11注：p标签默认行高16pxcss属性：vertical-align 设置元素的垂直对齐属性值：baseline：与元素的基线对齐。middle：与元素中部对齐。sub：字下沉。super：字上升。text-top：文本顶部对齐。text-bottom：文本底部对齐。top：和本行位置最高元素对齐。bottom：和本行位置最低元素对齐**注：**vertical-align只作用于在同一行内的元素，它的垂直并不是相对于整个Box而言的。递归**注：*

Day-10注：NaN不等于任何东西无论变量名还是函数名多单词拼接，首个单词首字母小写，其余单词首字母大写。eg: theFirstName实参形参数目对应，才会映射，俩个一块儿变JS语句toFixed() 科学计数法 var num =123.456789； document.write(num.toFixed(3)); // 科学计数法，保留三位有效数字，四舍五入，括号中是几，保留几位有效数字。return终止函数

Day-9注：一个100以内的数如果不能被除1以外的1-10整除，那么他就是质数。变量未定义投入使用，只有一种情况不报错console.log(typeof(a));typeof输出数据类型使用的是String typeof(typeof(undefind)); ==> 输出stringSwitch case 条件判断语句当switch中的n等于case后面的值时，输出对应case中的语句 var n=3; switch（n）{

Day-8注：1/0得 infinity(number)0/0得NaN(number)-1/0的 -infinity满足条件互斥才可以使用else ifJS运算符比较运算符： '>','<','==','>=','<=','!=' 比较结果为boolean值 逻辑运算符：//undefined, null, NaN, “”, 0, false ==>false;除以上是假，其余为真。 && 与运算符

Day-6注：js（javascript）解释性语言，单线程（严格说JavaScript的引擎是单线程的）原生部分：（ECMAscript ECMA是一个标准）DOM：操作html/css文档的BOM：操作浏览器的主流浏览器（3%市场份额，有自己的内核）IE tridentfirefox Gec