• 前端学习(二十六)移动端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乘法表

  • 相关阅读:
    CCF 认证
    ZOJ Light Bulb
    codeforce 605BE. Freelancer's Dreams
    HDU2546——背包DP——饭卡
    转载DD大神背包九讲
    背包九讲
    zstu4186——线段树——表白计划(未完成)
    zstu4189——后缀表达式——逻辑运算
    蛇形矩阵
    zs深入浅出学算法022——DFS———汉诺塔问题II
  • 原文地址:https://www.cnblogs.com/wxiaoyu/p/9579378.html
Copyright © 2020-2023  润新知