学习【JavaScript权威指南】(一)

不看不得了,一看吓一跳。。。好多简单的东西都不懂的,写个 $(function(){   } );   还需要查询下才记起来。。。

var book = {
   topic: "Javascript",
   fat: true   //true, false布尔值 null为空  undefined为未定义
}
book.author = "why-su"; //通过赋值创建一个新属性
book.content = {};  //{} 是一个空对象
book.plus = function(){  //定义一个方法
   return this.topic;    //this对自己的引用
} 
book.plus(); //执行方法

关于prototype的理解:https://www.cnblogs.com/loveyoume/p/6112044.html  ( prototype 这个属性是函数特有的属性 ,而且是函数的原型对象。对原型对象增加的属性及其方法,new实例化 之后的对象都能继承。)

    function Point(x,y) {
        this.x = x;
        this.y = y;
    }
    Point.prototype.z = function () {
        return Math.sqrt(this.x * this.x + this.y*this.y);
    };
    var p = new Point(3,4);  
    alert(p.z());   //结果是 5

隐藏,但保留空间  this.style.visibility = "hidden"

隐藏,不保留空间 this.style.display = "none"

Math的函数多多少少也要给我记住一些:

Math.pow(2,53);   //2的53次方
Math.sqrt(4); //4的平方根
Math.pow(8,1/3); //8的立方根
Math.ceil(.3); //向上取整
Math.floor(.3); //向下取整
Math.ceil(.3); //四舍五入

无穷大 Infinity  负无穷大 -Infinity  负零  -0    

被零整除在JavaScript不报错,只是返回无穷大Infinity。

零除零是没有意义的,返回  NaN (非数字值), NaN和任何数都不相等,包括自身,也就是无法使用 x == NaN来判断x变量是否是NaN,  而要使用  x!=x 来判断,当且仅当 x 为NaN的时候,表达式才为 true

var y = "one\
        long\
        line";  //一行显示的话要在每行末尾加上 \ 
var y = "one\long\line";  //如果 找不到\l这个转义字符的话,\会被忽略

var z = "0123456789";
z.charAt(0);   //第0位的字符
z.substring(2,5);   //索引第2位到第5位 截取
z.slice(2,5);  //和substring功能一样
z.slice(-3);  //截取最后三位
z.indexOf("1");  // 字符1 首次出现的位置
z.indexOf("1",3); //字符1 在 索引3位置之后 首次出现的位置
z.lastIndexOf("1"); //字符1 最后一次出现的位置

注意,字符串是固定不变的,类似replace(), toUppserCase() 都返回新字符串,原字符串本身是不变的。

if(o){
   //o不是false或任何假值(比如null或undefined)
}
if(o != null){
   //o不是 null
}

undefined 是 预定义的全局变量(和null不一样,不是关键字),它的值就是 未定义,二者都表示值得空缺

null == undefined  //true
null === undefined  //false

===  严格相等,如果两个值都是null或者都是undefined,则它们不相等

扫描二维码关注公众号,回复: 4034118 查看本文章

两个对象/数组 是永不相等的,即使含有相同的属性

类型转换

"2" * "5"  //结果是10,两个字符串均转换为10
"2" + "5"  //结果是"25", + 连接字符串
var n = 1 - "x";  //x无法转换为数字,得到的值为  NaN
n + "Object";  //NaN转为字符串 "NaN",得到的值是   "NaNObject"

"1" + 2 //结果是"12",数字转换为字符串后相加
1 + {}  //结果是  "1[object object]"
true + true  //结果是2,布尔值转换为数字后相加
2 +null //结果是2, null转换为0后相加
2 + undefined //结果是NaN, undefined转换为NaN后相加

区别:  ==  在判断前做了 类型转换, === 未转换类型

parseInt()  parseFloat()  全局函数,不属于任何类的方法

所有对象继承了2个转换方法:1,toString()   2,valueOf() 

JavaScript中对象到字符串的转换:先找 toString(),再找 valueOf(), 如果无法获得一个原始值,则抛类型转换异常

对象到数字的转换:先找valueOf()再找 toString(),否则抛异常

var d;  // 未赋值之前,值是 undefined
e;  //报错,e is not defined
var arr = [0,,,,4];  //包含5个元素,其中三个元素是 undefined
var a1 = [];  //空数组
var a2 = {};  //空对象
var o = {x:1, y:{z:3}}; //可以使用 o.y.z 或 o["y"]["z"]取值

所有无法转换为数字的操作数都会转为 NaN

new Object()
new Object   //创建对象,如果不需要传任何参数,括号可以省略

JavaScript的所有值不是真值就是假值

11 < 3 //false 数字比较
"11" < "3"  //true, 字符串比较
"11" < 3  //false, "11"转换为数字再进行数字比较
"one" < 3  //false,数字比较,"one"转换为NaN, >,<,>=,<=只要有一个为NaN,结果都为false

关于eval() : https://blog.csdn.net/u011897392/article/details/58139194

typeof null //为"object"
typeof undefined //为"undefined"
typeof true或false //为"boolean"
typeof 任意数字或NaN  // 为"number"
typeof 字符串  //为"string"
typrof 函数  //为"function"

in  

//属性
var o = {x: 1, y: 2};
"x" in o;  //true, 对象o有属性x
"toString" in o;  //true 对象继承了toString()方法

var data = [7,8,9]; 
"0" in data;  //true 如果是数组,因为是属性,data[0]为7
0 in data;  //true, 数字转换为字符串
3 in data;  //false, 没有索引为3的元素

还可以这样用哈哈 (o゚▽゚)o  

<a href="javascript:void(alert('要死要死'));">链接</a>
var o = new Object(); //创建空对象,和var o = {} 一样
var o = new Array();
var o = new RegExp("js");

var a= {a0: 0,a1: 1, a2: 2, a3: 3};
//我们知道两种写法 a.a0, a["a0"] 都可以获得值,但以下这种情况只能用a["  "]的写法
var addr;
for(var i = 0; i < 4; i++){
   addr += a["a"+i] + "\n";
}
    $(function () {
        var o = {x: 1,y: 2};   //o 从 Object.prototype 原型,继承对象的方法
        var a = inherit(o);   // a 继承 o 和 Object.prototype
        console.log(a.y);   //2
        a.x = 2;  //覆盖继承来的属性
        console.log(o.x);   //1  原来对象o的属性没受到影响
        console.log(a.x);   //2
        a.z = 3;  //属性赋值要么失败,要么创建一个属性
        console.log(a.z);   //3

       //如果查不到该属性
       console.log(o.w);  //返回undefined
       console.log(o.w.length);  //因为null或undefined是没有属性的,这里会报错
       //简练的防止报错的常用方法
       var len = o && o.w && o.w.length;
    })
    function inherit(p){
        if(p == null) throw TypeError();
        if(Object.create){
            return Object.create(p);
        }
        var t = typeof p;
        if(t !== "object" && t !== "function") throw TypeError();
        function f() {};
        f.prototype = p; //属性赋值要么失败,要么创建一个属性
        return new f();
    }


var o = {x: 1}
"x" in o;  //true
"y" in o;  //false
"toString" in o; //true o继承toString属性

//除了in之外,可以使用 !== (!== 可区分null和undefined,注意不是 !=)
o.x !== undefined    //true
o.y !== undefined    //false
o.toString !== undefined  //true o继承toString属性

o.hasOwnProperty("x");   //true
o.hasOwnProperty("y");   //false
o.hasOwnProperty("toString");  //false, 不是对象的自有属性

//跳过继承来的属性
for(p in o){
  if(!o.hasOwnProperty(p)) continue;
}

getter 和 setter

        var p = {
            $n: 1,  //$符号暗示这个属性是一个私有属性
            x: 3.0,
            y: 4.0,
            get r() { return Math.sqrt(this.x * this.x + this.y * this.y);},
            set r(newValue){
                var oldValue = Math.sqrt(this.x * this.x + this.y * this.y);
                var ratio = newValue/oldValue;
                this.x *= ratio;
                this.y *= ratio;
            }
        };
        console.log(p.r);    //5
        p.r = 50;
        console.log(p.x +","+p.y); //30,40

序列化对象 serialization是指将对象的状态转换为字符串,也可将字符串还原为对象。

          JSON.stringify() 序列化,JSON.parse() 还原JavaScript对象

数组:

var a = [];
var b = new Array();   
var c = new Array(10);  //只写一个参数的话,创建的数组长度是10,但是没有任何元素
var d = new Array(5,4,3,2,1,"test","why"); //长度是7
var e = [5,4,3,2,1,"test","why"]; //长度是7

//可以使用 负数或非整数来索引数组。这种情况下,数值将转换为“字符串”,将“字符串”作为属性名来用
a[-1.23] = true;  //创建名为"-1.23"的属性
a[1.00] //和 a[1]一样
a["1000"]  //和a[1000]一样,如果不存在,则返回 undefined
a[1000] = 1; //赋值添加一个新元素,并且设置length为1001

//JavaScript数组不存在“越界”错误

//稀疏数组
var a1 = [,,];  //长度是2,但没有元素
var a2 = [undefined,undefined];
a1[0]  //undefined
a2[0]  //undefined
0 in a1     //false,  在索引0处没有元素
0 in a2;    //true, 在索引0处有元素

a = [1,2,3,4,5] 
a.length = 0;  //删除所有的元素,a为[]
a.length = 5;  //长度为5,但没有任何元素,像new Array(5);

//可以设置length为只读
Object.defineProperty(a,"length",{writable: false});
//此时再使用 a.length = 0;就不会改变了。

//添加元素
var a = [];
a[5] = "zero";
//或者使用 push
a.push("zerp");   
a.push("zero","one");  //添加2个元素

//删除元素
var a = [1,2,3,4,5];
delete a[1];         //在索引1位置不再有元素
console.log(1 in a);  //false 索引1位置未在数组中定义
console.log(a.length);  //5 delete操作不影响数组长度

a.pop();  //删除数组的最后一个元素,长度改变
a.shift(); //删除数组的第一个元素,长度改变

//for循环
var a = [1,2,3,4,5];
for(var i = 0; i < a.length; i++){
   if(!a[i]) continue;  //跳过null,undefined,不存在的元素
   if(a[!] === undefined) continue;  //跳过undefined
   if(!(i in a)) continue; //跳过不存在的元素
}
//in 会跳过不存在的索引不会被遍历到
for(var i in a){
   if(!a.hasOwnProperty(i)) continue; //跳过继承的属性
   console.log(a[index]);
}

//forEach()方法,按照索引顺序遍历数组
a.forEach(function(value,index){
   console.log(value);  //value是值,index是索引
});

//join方法将数组所有元素转为字符串
var a = [1,2,3,4,5];
console.log(a.join());  //1,2,3,4,5  默认用逗号
console.log(a.join("")); //12345
console.log(a.join(" "));  //1 2 3 4 5

a.reverse();  //数组元素颠倒(在原数组的基础上),a变为 [5,4,3,2,1]

//sort排序
var b = ["scd","Ad","por","Fased","gerg","da"];
console.log(b.sort());   //按照字母表顺序排序,区分大小写
console.log(b.sort(function (a,b) {   //自定义排序规则,不区分大小写,负数排前面
    a = a.toLowerCase();
    b = b.toLowerCase();
    if(a < b) return -1;
    if(a > b) return 1;
    return 0;
}));

//slice截取数组,包左不包右, 不会修改原数组
var a = [0,1,2,3,4,5]; 
console.log(a.slice(0,3)); //[0,1,2]
console.log(a.slice(3));  //[3,4,5]  索引3后的内容
console.log(a.slice(0,-1)); //[0,1,2,3,4]  -1表示倒数第一个
console.log(a.slice(-3,-1)); //[3,4]  -3表示倒数第三个

//splice()会改变原数组,第一个参数指插入/删除的起始位置,第二个参数指定 删除的元素个数,
// 如果省略第二个元素,则从起始点位置后的所有元素都被删除,返回被删除的数组。
var a = [0,1,2,3,4,5,6];
console.log(a.splice(5)); //[5,6]
console.log(a); //[0,1,2,3,4]
console.log(a.splice(1,3));  //[1,2,3]
console.log(a);  //[0,4]
//从第三个参数开始,指定了要加入的元素
console.log(a.splice(1,0,1,2,3));  //[]
console.log(a);  //[0,1,2,3,4]

//every()是指所有元素都必须满足要求才返回true, some()是只要有一个元素满足要求就返回true
var a = [0,1,2,3,4,5,6]; 
console.log(a.every(function (t) { return t<10; })); //true 所有元素都小于10
console.log(a.some(function (t) { return t % 2 === 0; })); //true 至少存在一个元素能被2整除

//reduce按照 从左到右的顺序,第二个参数是初始值
var a = [1,2,3];
//初始值是0,按照从左到右顺序: 0 + 1 + 2 + 3 = 6
var sum = a.reduce(function (x, y) { return x + y; },0); 
//初始值是1,按照从左到右顺序: 1*1*2*3 = 6
var product = a.reduce(function (x, y) { return x * y; },1);
//初始值是0,按照从左到右顺序判读,结果3
var max = a.reduce(function (x, y) { return x > y ? x : y; },0);

//reduceRight() 方法与 reduce()相反,从右至左

JavaScript,函数可以嵌套在其它函数里面

当调用函数的时候传入的实参比函数声明时指定的形参个数要少,剩下的形参都将设置为undefined

arguments是指向实参对象的引用,使用下标可以访问传入函数的参数

//传入参数数量不定
function max(){
     var max = Number.NEGATIVE_INFINITY;  //负无穷大
     for(var i = 0; i < arguments.length; i++){
         if(arguments[i] > max) max = arguments[i];
     }
     return max;
}

调用 max(-34,-9,-12,-13,-48) 得到最大的 -9

第8章【函数】看的有点晕

//以下创建了10个闭包,但这些闭包都是在同一个函数调用中定义的,因此它们可以共享变量i
function constfuncs(){
   var funcs = [];
   for(var i = 0; i < 10; i++){
      funcs[i] = functio(){ return i;};
   }
   return funcs;
}

var funcs = constfuncs();
funcs[5]();   //结果是10,而不是5,这10个闭包的返回值都是10,因为共享了变量i


//需要这样写
function constfunc(i){
   return function(){return i;}
}
var funcs = [];
for(var i = 0; i < 10; i++){
  funcs[i] = constfunc(i);
}
funcs[5]();   //结果是5
function check(args){
        var actual = args.length;  //实际传参个数
        var expected = args.callee.length; //期望的传参个数
        if(actual != expected)
            throw Error("Expected " + expected + "args; got " + actual);
}

function f(x,y,z){
  check(arguments);
  return x + y + z;
}

f(1)报错 f(1,2)报错 f(1,2,3)正确返回6

猜你喜欢

转载自blog.csdn.net/why_su/article/details/83781002