《JavaScript高级程序设计》读书笔记一（基于ES5）

Js重要的一些概念学习（基于ES5）

在ES5里面一些基础的概念仍然是Js重要的概念，这对于ES6的学习也是很有帮助的。所以对于《JavaScript高级程序设计》进行学习总结。

Js里面的参数问题

   //基本类型
        function fn(number){
            number+=15;
            return number;
        }
        var ret=10;
        var ans=fn(ret);
        alert(ret);//全局变量不受影响
        alert(ans);//函数是按照按值传递，所以直接将10赋值给number
        //所以，这时候变成一个局部变量，所以这时候 ans=30
        //引用类型
        function setName(obj){
            obj.name="ljx";//这里面的obj是一个外部的全局对象
            obj=new Object();//对Obj进行重新赋值，这时候obj就是一个局部变量
            obj.name="lihuanhuan";
        }
        var person=new Object();
        setName(person);
        alert(person.name);//返回ljx 说明person赋值给obj说明二者都是按照相同引用
        //来访问同一个堆内存

Js里面的对象和属性

           //新建立一个对象
        var dog=new Object();
        dog.name="汪汪";
        alert(dog.name);
        //基本数据类型没有属性，没报错的话也是undefined
        var job="teacher";
        job.name="ljx";
        alert(job.name);

Js里面检测类型

        //使用typeof(基本类型) instanceof(引用)
        var a=123;
        var b="ljx";
        var c=true;
        var d=undefined;
        var e=null;//返回object
        var o=new Object();//返回object
        alert(typeof(a));
        alert(typeof(b));
        alert(typeof(c));
        alert(typeof(d));
        alert(typeof(e));
        alert(typeof(o));
        var p=new Object();
        alert(p instanceof(Object));//返回true
        var arry=new Array();
        alert(arry instanceof(Array));//返回true
        var r=new RegExp();
        alert(r instanceof(RegExp));//返回true

Js里的indexOf属性和lastIndexOf属性

    var nums=[0,1,2,3,4,5,4,3,2,1,0];
    alert(nums.indexOf(4));
    alert(nums.lastIndexOf(2));

Js里面的函数声明和函数表达式

        //函数声明提升
        alert(sum(10,10));//输出20
        //function sum(num1,num2){return num1+num2;};
        //如果保存了改成函数表达式报错,这时候sum是一个变量，没有保存函数的引用
        var sum=function (num1,num2){return num1+num2;};//Uncaught TypeError: sum is not a function

Js里面的迭代方法

      //1.every()保证每一项都是true,返回true,some()有一项是true返回true
        var nums=[1,2,3,4,5];
        var everyNums=nums.every(function(item,index,array){
            return (item>3);
        }); 
        alert(everyNums);
        var someNums=nums.some(function(item,index,array){
            return (item>3);
        });
        alert(someNums);
        //2.filte过滤器
        var filterNums=nums.filter(function(item,index,array){
            return (item>3);
        })
        alert(filterNums);
        //3.map函数
        var mapNums=nums.map(function (item,index,array) {
            return item*3;
        })
        alert(mapNums);
        //foreach()函数
        var foreachNums=nums.forEach(function (item,index,array) {
            return index;
        })
        alert(foreachNums);
        //reduce()和reduceRight()函数两个函数只是计算方向相反
        var reduceNums=nums.reduce(function (prev,cur,index,array) {
            return prev+cur;//迭代计算
        })
        alert(reduceNums);

Js里面的内置属性

 //arguments.callee
        // function fac(num){
        //     if(num<=1)
        //         return 1;
        //     else
        //         return num*fac(num-1);//这里其实存在耦合
        // }
        // var newFac=fac;
        // fac=function() {
        //     return 0;
        // }
        // alert(newFac(4));//0
        //所以这里需要arguments.callee进行(这是一个指针)解耦
        //更改
        function fac(num){
            if(num<=1)
                return 1;
            else
                return num*arguments.callee(num-1);
        }
        var newFac=fac;
        fac=function() {
            return 0;
        }
        alert(newFac(4));//返回24
        alert(fac(4));//返回0
        //this指针
        window.tags="article";
        var p={"tags":"ljx"};
        function myTags(){
            alert(this.tags);//这个this的对象是window
        }
        myTags();//article
        p.myTags=myTags;//将这个函数复制给p
        p.myTags();//ljx
        //caller保存了某个函数的引用
        function inner(){
            //alert(inner.caller);//inner函数名就是指针,旧版本的Opera不支持
            //防止耦合
            alert(inner.arguments.callee.caller);//严格模式下不能够使用arguments.callee,不能为arguments.callee复制
        }
        function outer(){
            inner();//outer()调用了inter(),指向outer()
        }
        outer();

Js里作为值的函数

//函数本身就是一个变量，所以函数也可以作为函数的参数或者一个返回值.
        function MakeFunctions(otherFunction,otherArgument){//这个函数直接将函数和参数进行封装
            return otherFunction(otherArgument);
        }
        //定义一个加数函数
        function sum(num){
            return num+5;
        }
        var ans=MakeFunctions(sum,10);//将这个10传入到sum里面
        alert(ans);
        //将一个函数作为一个结果，返回到另外一个结果里面,需要把对象属性进行排序
        function compareTwoFunction(propertyName){
            return function(object1,object2){
                var value1=object1[propertyName];
                var value2=object2[propertyName];
                if(value1<value2)
                    return -1;
                else if(value1>value2)
                    return 1;
                else
                    return 0;
            }
        }
        var test=[{"name":"ljx","age":23},{"name":"lijiaxu","age":25}];
        test.sort(compareTwoFunction("name"));
        alert(test[0].name);
        test.sort(compareTwoFunction("age"));
        alert(test[1].age);

Js函数没有重载

      //函数没有重载
        /*重载是指函数名相同时，只要函数参数的类型，数量，顺序不同即可访问，js里面没有函数重载的定义*/
        function sum(num){
            return num+7;
        }
        function sum(num){
            return num+5;
        }
        var ans=sum(10);//返回15，第二个会覆盖第一个,函数本质上就是一个对象（变量）,函数名就是指针，两个同名函数进行覆盖时，就是变量赋值
        alert(ans);

Js函数的属性和方法

//1.length属性
        function showName(name){
            alert(name);
        }
        function sum(num1,num2){
            return num1+num2;
        }
        function showLjx(){
            alert("Ljx");
        }
        alert(showName.length);//1
        alert(sum.length);//2
        alert(showLjx.length);//0
        //函数的length分别返回的是函数参数的个数
        //2.prototype属性
        /*
        1.prototype不枚举
        2.prototype是很多引用类型的公共实例原型方法的由来
        */
        //3.apply()和call()
        //作用是在某个特殊的作用域里面去设置函数属于哪个作用域
        //其中apply()方法可以传入两个值，分别是arguments和数组对象
        function sum(num1,num2){
            return num1+num2;
        }
        function sum1(num1,num2){
            return sum.apply(this,arguments);
        }
        function sum2(num1,num2){
            return sum.apply(this,[num1,num2]);
        }
        alert(sum1(10,15));
        alert(sum2(10,15));
        //call()和apply()没有任何的区别在接受参数的时候需要一个一个写进去
        function sum3(num1,num2){
            return sum.call(this,num1,num2);
        }
        alert(sum3(10,15));
        //指定作用域
        color="red";
        var c={color:"green"};
        function showColor(){
            alert(this.color);
        }
        showColor();
        showColor.apply(window);
        showColor.call(window);
        showColor.call(this);
        showColor.apply(this);
        showColor.call(c);
        showColor.apply(c);
        //bind()方法直接创建一个函数实例,绑定对应的this指针
        var newColor=showColor.bind(c);
        newColor();

boolean表达式转化true

  var booleanObject=new Boolean(false);
        alert(booleanObject);//false
        var ans=booleanObject && true;//Boolean表达式都会被转化为true
        alert(ans);

global全局对象和Math对象说明

        /*
        Global对象
        1.ecodeURL()/decodeURL()
        2.decodeURL()/decodeURL()
        3.eval() 功能强大，JS解析器，不安全
        4.引用类型构造方法和NAN undefined null都是Global的属性 isNAN()、isFinite()、parseInt()、parseFloat()
        5.Global全局对象是window的一部分
        Math对象
        Math.round()//四舍五入
        Math.ceil()//向上取整
        Math.floor()//向下取整
        Math.random()随机数
        Math.random()*10+1;//10个随机数，从1开始第一个
        */

Js的Number对象

 //创建Number对象
        var numObject=new Number(10);
        alert(numObject);
        //number的toString()方法用来判断进位
        alert(numObject.toString());
        alert(numObject.toString(2));
        alert(numObject.toString(8));
        alert(numObject.toString(16));
        var numfix=10.115;
        alert(numfix.toFixed(2));//四舍五入
        var numex=1000000;
        alert(numex.toExponential(6));//规范化//1.000000e+6

String类型以及对应方法

            //1.创建一个String对象
        var stringObj=new String("Hello,ljx");
        //alert(stringObj);
        //2.1charAt()方法
       //alert(stringObj.charAt(3));//l
        //2.2charCodeAt()
        //alert(stringObj.charCodeAt(3))//返回l的字符编码
        //2.3字符数组索引
        //alert(stringObj[3]);
        //3.1concat()方法，拼接字符串
        //console.log(stringObj.concat("!.."));
        //3.2接受多个参数
       // console.log(stringObj.concat("helooooo","you...."));
        //4获取子串的三个方法
        console.log(stringObj.slice(3));//当前位置到末尾
        console.log(stringObj.substring(3));//当前位置到末尾
        console.log(stringObj.substr(3));//当前位置到末尾
        console.log(stringObj.slice(3,6));//当前位置到末尾-1
        console.log(stringObj.substring(3,6));//当前位置到末尾-1
        console.log(stringObj.substr(3,4));//当前位置到后面的n个字符
        //4.1传入是负值的情况
        console.log(stringObj.slice(-3));//返回ljx，一个参数字符串个数和负数相加
        console.log(stringObj.substr(-3))//返回ljx 一个参数长度与负数相加
        console.log(stringObj.substring(-3))//返回字符串,默认从0开始
        console.log(stringObj.slice(3,-4));//返回3-5
        console.log(stringObj.substring(3,-4));//等效(0,3)
        console.log(stringObj.substring(3,0));//等效(0,3)
        console.log(stringObj.substr(3,-4));//返回空
        //字符串的位置方法
        //indexOf和lastIndexOf
        //只是接受一个一个参数，表示查询第一个出现的字符,返回索引
        console.log(stringObj.indexOf("l"));
        console.log(stringObj.lastIndexOf("l"));
        //若是两个参数，则表示从哪个位置进行查询
        console.log(stringObj.indexOf("l",1))//返回2
        console.log(stringObj.indexOf("l",9))//返回-1不存在
        //lastIndexOf类似，就不在说了
        //trim()->删除字符串前面和后面的空格,返回字符串
        var newString="   Hello,ljx   ";
        console.log(newString.trim());
        //字符串大小写转换
        var str="hello,ljx";
        console.log(str.toUpperCase());//与toLocaleUpperCase()等效
        console.log(str.toLocaleLowerCase());//与toLowerCase()等效
        //模式匹配(match)和正则放在一起说明
        //localeCompare()
        console.log(stringObj.localeCompare(str));//比较大小，如果大返回1,小返回-1,其它0
        //fromCharCode()//将字符编码转化对应的字符串，这东西可以传入多个参数
        console.log(String.fromCharCode(101,102,103,104,105));