• js高级



    js高级
    0级dom事件
    <input type=button onclick="alert(js代码)"
    这样其实生成了一个function onclick(event)方法把其中js包起来了
    0级dom事件
    .onclick=function(){
    alert("one");
    }
    通过标签选择到dom元素,所以要放在标签加载之后
    执行,一个是放到哦onload里面一个是放到尾巴

    2级dom事件
    .addeventlistener("click",function(){
    alert("one");
    })
    .addeventlistener("click",function(){
    alert("two");
    })
    绑多个事件不会覆盖,冒泡和捕获,先捕获后冒泡



    5种基本数据类型
    undefined ulloolean umberstring
    变量创建未赋值,undefined有一个值就是undefined
    null 空对象指针没有值
    var foxmale=true;//boolean布尔值
    var foxage=123 ;//js中不分浮点整形不拉不拉,全部都是number
    var foxnam="小二黑";字符串string
    值类型
    1种复杂类型
    object
    var fox=new object();//创建对象
    fox.age=18;//fox["age"]=18;一样的效果但是 []的优点是可以通过
    变量来动态访问属性

    delete fox.age;//实用delete关键字删除自定义属性
    // JSON.stringify(fox);把对象转成json格式
    JSON.parse() 把json转成对象
    eval//将json格式字符串转成js对象,但是要注意两边
    加上"()";
    //eval方法可以动态执行js代码
    可以把字符串转换成js代码,在调用的位置执行
    js引擎,碰到了eval方法,就会解析里面的字符串,在调用的位置
    把js方法放进去。像是一个自定义click事件



    //检查数据类型typeof运算符
    alert(typeof fxnam);
    //--值类型不能动态添加属性
    var foxname="bigying";
    var foxname1= foxname.concat("erdan");
    alert(foxname1);
    浏览器干的事
    var foxname=new string("bigying");
    var foxname1=foxnam.concat("erdan");
    foxname1.tostring();
    alert(foxname1);

    包装对象三大包装对象
    var mstring =new string ();//string包装对象
    var mnum=new number();
    var bbool=new boolean();


    string 包装对象的常用方法
    .trim();
    .slice()分割
    .split()

    数组是object包装对象
    push往原数组尾部添加新的元素,返回长度
    pop 尾部元素删掉,返回删掉的元素
    unshift:头部追加新元素,返回长度
    shift:头部删除元素,返回删除的那个元素
    <script type="text/javascript">
    var numArr = [];
    numArr.push(1);
    numArr.push(2);
    numArr.push(3);
    numArr.push(4);
    alert(numArr);
    //先进先出---队列
    var numStr = "";
    //注意:数组长度在变
    for (var i = 0; i < 4; i++) {
    numStr += numArr.shift();
    }
    //alert(numStr);
    //后进先出---堆栈
    for (var i = 0; i < 4; i++) {
    numStr += numArr.pop();
    }
    alert(numStr);
    </script>


    function函数
    //声明式函数
    function sayhi(){}
    //函数表达式(匿名)
    var sayhi2=function(){}

    浏览器会优先加载声明式函数,保证在任何位置都可以调用的到
    函数表达式,执行到函数表达式才会拥有这个函数变量

    -------------函数类型
    var water=new function("name","age","alert()");
    water("bigying",18);


    -------------arguments是方法的局部变量保存了传入的实参
    function eatfood(){
    arguments[0]......
    }
    用于模拟实现方法的重载。。。。所以js中定义方法
    没必要定义形参,因为根本木有用。
    如果需要判断传入的参数类型,需要配合typeof

    -------------获取函数本身----------------------
    arguments.callee 可以获取函数本身
    function jiechengnum(num){
    if(num<=1)
    {
    return 1;
    }
    else{
    //优化,在内部通过这个调用自身,
    避免了在外面被改变覆盖
    return num*arguments.callee(num-1);
    }
    }


    --------------this----------
    方法中的this是可以动态改变的
    实用方法对象的.call调用()第一个参数是希望改变的this
    sayhi.call(对象,参数)
    this就不是谁点就是谁,而是第一个参数的
    区别是参数是数组
    .apply(对象,[参数])

    -------------length------
    函数对象的length属性可以获取定义形参个数
    -------------工厂--------
    function Createpeople(name,age)
    {
    var c=new object();
    c.name=name;
    c.age=age;
    return c;
    }
    -------------构造函数模式----
    function People(name,age,mehtod)
    {
    this.name=name;
    this.age=age;
    this.method=method;
    }
    var people1=new people("bigying",24,function(){"alert
    (bigying)"});//构造函数模式----
    var people2=new people("bigying",24,function(){"alert
    (bigying)"});//构造函数模式----
    此时两个对象的method方法不和c#一样在一个方发表。
    而是在各自地址
    -------------原型模式------------像公共父类一样
    此时用原形来提起公共属性吧共有的属性提到方法的原型中
    实用构造函数创建的对象,都共享原型里面的属性
    function People(name,age)
    {
    this.name=name;
    this.age=age;
    }
    //存进去method到people的prototype里
    people.prototype.method =function(){alert (123);};
    var people1=new people("bigying",24);
    var people2=new people("erdan",24);
    people1.method


    -------------继承-----------
    function dog(name,age){
    this.name=name;
    this.age=age;
    }
    var dog1 =new dog("牧羊犬",10);
    function smalldog(name,age,milk)
    {
    dog.call(this,name,age);//这里用call改变了this指向,本来是谁
    点就是谁,此处应该是dog的,但是call了之后,this变成了第一个参数的对
    象,这里就是smalldog1,因此dog里面的构造函数的this发生了改变,这样就
    实现了继承
    this.milk=milk;
    }
    var smalldog1=new smalldog("茶犬",0.1,"三鹿");

    -------------作用域---------

    function setName(o)
    {
    o.name = "lihong";//对应到了c
    o = new Object();//新的对象指向新的地址
    o.name = "james";//给新对象的name属性
    局部的,结束之后干掉了
    }
    var c = new Object();
    setName(c);
    alert(c.name);

    ----------------没有块级作用域
    //以方法为单位的作用域,出了方法失效

    ---------------闭包跟作用域链-----
    指有权可以访问另外一个函数内部的局部变量,这就是闭包
    延长局部变量的生命周期
    实际运用,window.onload中的局部变量方法可以多次调用

  • 相关阅读:
    JavaScript 常见面试题
    textarea 元素的 placeholder 属性不显示
    CSS 画一个八卦
    CSS 画一个心
    JS判断客户端是否是iOS或者Android端
    前端面试题(一)
    选中文字改变默认颜色
    红包雨的实现
    template 的使用
    函数和入参
  • 原文地址:https://www.cnblogs.com/zhanying/p/4168336.html
Copyright © 2020-2023  润新知