前端学习(二十六）移动端s（笔记）
===================================================
弹性布局
rem布局
---------------------------------------------------
CSS3 transform
rotate 旋转
translate 平移
scale 缩放
skew 扭曲
=======================================================
rotate 深入
rotate() Z轴
rotateX() X轴
透视效果
perspective(px) 透视的强度
数值越小越明显
推荐范围: 800-1200
切记：
transform一定要加初始值
==========================================================
translate
translate(x,y) x轴和y轴方向平移
Z轴平移
translateZ()
--------------------------------------------------
开启3D模式
transform-style: preserve-3d;
开启3D模式，一般加给父级
perspective一般加给父级
3D正反面
父级
-webkit-transform-style: preserve-3d;
-webkit-transition: 1s all ease;
-webkit-transform: perspective(800px) rotateY(0deg);
子级
正面
-webkit-transform: translateZ(1px);
反面
-webkit-transform: translateZ(-1px) scale(-1,1);
3d盒子(立方体)
父级
-webkit-transform-style: preserve-3d;
-webkit-transition: 1s all ease;
-webkit-transform: perspective(800px) rotateX(0deg) rotateY(0deg);
子级
front translateZ(1px);
back translateZ(-1px);
left translate(-150px,0) rotateY(-90deg);
right translate(150px,0) rotateY(90deg);
top translate(0,-150px) rotateX(90deg);
bottom translate(0,150px) rotateX(-90deg);
==========================================================
定时器并不稳定
当transition走完执行的事件
transitionend 必须用事件绑定加
==========================================================
翻书
iNow oBox oFront oBack oPage2
0 1 1 2 2
1 2 2 3 3
2 3 3 1 1
3 1 1 2 2
4 2 2 3 3
5 3 3 1 1
6 1 1 2 2
iNow%3+1
(iNow+1)%3+1
爆炸
反转
========================================================
字符串对象
str.charAt()
str.indexOf()
str.lastIndexOf()
str.substring()
str.split()
str.toUpperCase()
str.toLowerCase()
数组对象
arr.push()
arr.pop()
arr.unshift()
arr.shift()
arr.splice()
arr.join()
arr.concat()
arr.reverse()
arr.sort()
Math 对象
Math.random() 获取0-1的随机小数，绝对不包括1
取整
Math.floor() 向下取整
Math.ceil() 向上取整
Math.round() 四舍五入
其他
Math.pow() n次方 幂
Math.pow(3,2) 3的2次方
Math.sqrt() 开方
Math.max(10,30,0,100,25) 最大值
Math.min() 最小值
Math.abs() 绝对值
三角函数
Math.PI π
Math.sin()
Math.cos()
Math.atan2()
function rnd(n,m){
return parseInt();
}
======================================================
i的问题
1.循环中加事件，事件中使用i
2.循环中加定时器，定时器中使用i
函数
==============================================
i值问题怎么解决?
封闭空间、自执行函数、闭包
================================================
传统语言
c语言
申请空间(1000)
...用
free(1000)
内存泄露
内存溢出
垃圾回收机制 生命周期 生存周期
局部 很短 函数调用完成后，里面的局部变量会消失
全局 很长 关闭页面的时候
闭包 可长可短
只要里面的函数还有用，函数中局部变量就不会消失
只要里面的函数还有用，函数中所有的局部变量就不会消失
只要里面的函数还有用，那整条作用域链上的变量就不会消失
function show(){
var a = 12;
}
调用前 没有a
show(); 调用中 有a
调用后 没有a
function show(){
var a = 12;
document.onclick = function(){
alert(a);
};
}
调用前 没有a
show() 调用中 有a
调用后 有a
function show(){
var a = 12;
var b = 5;
document.onclick = function(){
alert(a);
};
}
调用前 没有a，没有b
show() 调用中 有a，有b
调用后 有a，有b
var a = 12;
function show(){
var b = 5;
function show2(){
var c = 3;
document.onclick = function(){
alert(a);
};
}
show2();
}
作用域链:现在自身找，如果没有，找父级，如果在没有再往上找。直到找到全局。
======================================================
闭包是什么?
======================================================
递归
函数调用自己，只是递归的一种形式
大事化小
1.兔子不吃东西，不会死
2.兔子可以近亲繁殖
3.小兔子，三个月长大
1 2 3 4 5 6 7 8 9 10 11 12
1 1 2 3 5 8 13 21 34 55 89 144
12 144 1440
24 46368 463680
36 14930352 149303520
48 4807526976 48075269760
斐波那契数列
斐波那契算法
兔子数列
=======================================================
99乘法表
