zoukankan      html  css  js  c++  java
  • js基础进阶

    首先声明本次随笔大部分来源于huizhi网,单纯用于自己记笔记

    1 数据类型

    数据类型分为:基础类型和对象类型。

    基础类型:NumberStringBooleanNullUndefined

    对象类型:object

    JavaScript不支持创建任何自定义的类型,所有的值都是上述中六种数据类型之一

    1.1 number 类型 包括浮点类型和NaN(Not a Number)

    1.2 string 类型

    1.3 转移字符

    1.4 boolean 类型 返回只有truefalse (注意 一定是小写)

    1.5 Null 和 undefined

    Null和Undefined类型都只有唯一的特殊值,即nullundefined。不过null是关键字而undefined不是。

    你也可以认为undefined是表示系统级的、出乎意料的或类似错误的值的“空值”;而null表示程序级的、意料之中的值的“空值”。如果你想吧两者赋值给变量或者属性等,最好的选择是null

    2 对象(类似于python的字典)

    对象(object)是JavaScript的基本数据类型之一。对象是一种复合值:它把多个值(原始值或者其他对象)聚合在一起,可以通过名字访问这些值。对象也可看做是 属性的无序集合,每个属性都是一个名/值对。属性名是字符串,因此我们可以把对象 看成是从字符串到值的映射

    2.1 创建对象

    2.1.1 方式一 使用new操作符后跟object 构造函数

    var obj = new Object(); 
    obj.name = "MangGuo"; 
    obj.age = 25;

    2.2.2 方式二 使用对象字面量表示法

    var obj = {
        name : "MangGuo", //name是属性名,"MangGuo"是值
        age : 25
    }

    在对象字面量中,使用逗号来分隔不同的属性,因此"mangGuo"后面是一个逗号。但是,在age属性的值25的后面不能添加逗号,因为age是这个对象的最后一个属性。

    使用对象字面量创建对象需要注意:当属性名中含有空格、特殊字符或者是保留字的时候一定要加上引号,其他情况下可加可不加。如下

    var obj = {
        "name" : "huizhi",<br>    "hui zhi" : "hubwiz", //属性名中有空格
        "hui-zhi" : "hubwiz", //属性名中有特殊字符
        "for" : "baoliuzi"     //属性名是保留字
    }
    document.write(obj.name);  //输出obj对象属性名为name的值
    View Code

    2.2 访问属性

    访问对象的属性有两种方式:点或者中括号操作符。点操作符在我们上一页当中已经应用到了。

    var cat = {
        "name": "tom",
        "sex": "man",
        "color": "yellow"
    }
    var name1 = cat.name; //通过点操作符来访问对象属性
    var name2 = cat["name"]; //通过中括号操作符来访问对象属性

    2.3 删除属性

    语法:delete 对象名.属性名;

    2.4 hasOwnProperty()函数

    对象是属性的集合,我们经常会检测集合中成员的所属关系——判断某个属性是否属于某个对象。这个时候就用到了我们前文提到的:hasOwnProperty 函数。

    语法:object.hasOwnProperty(proName);

    2.5 原型

    每一个对象都连接到一个原型对象,并且可以从中继承属性。所有通过字面量创建 的对象都具有同一个原型对象,并可以通过Object.prototype获取对原型 对象的引用。通过new关键字后跟构造函数创建的对象的原型,就是构造函数的prototype 属性的值。

    比如通过new Object()创建的对象和字面量创建的对象一样也继承自 Object.prototype

    var sum = {
      name: "汇智网",
      type: "加法"
    }
    Object.prototype.add = function(){
      alert("原型对象的方法");
    }
    sum.add(); // =>原型对象的方法

    2.6 遍历属性

    我们除了检测属性的存在,我们还经常对属性进行遍历。通常我们会用:for/in

    for / in 语句可用来遍历一个对象的所有属性名。它会将所有的属性(包括函数和原型中的属性

    var cat = {
        "name": "小白",
        "type": "汇智网",
        "eat": function(){
        alert("吃老鼠");
        }
    }
    Object.prototype.color = "白色";
    var name;
    for(name in cat){
        document.write(cat[name] + "
    ");
    }

    3 数组

    3.1 创建数组

    Array类型是Javascript中比较常用的类型,它和其他语言的数组有很大的区别,虽然它们数组的数据都是有序列表。但是JavaScript的数组可以保存任意类型的数据(包括它本身)。且大小是动态的,可以随着数据的添加而自动增长。

    3.1.1 创建的第一种方式

    var arr = new Array();
    var arr = new Array("cat","dog","mouse");

    3.1.2 创建的第二种方式

    var arr = [];
    var arr = ["cat", "dog", "mouse"];

    3.2 数组长度 每个数组都有一个长度,要想获得这个长度,我们通过数组的length属性来获取。 length属性值代表数组中元素的个数

    3.3 稀疏数组

    稀疏函数就是从0开始的不连续索引的数组。

    var arr = new Array(3);
    arr.length; // 
    arr[0] = 1;
    arr[100] = 98;
    arr.length; //length为101

    3.4 遍历数组

    数组就是对象,所以我们可以用 for/in 来遍历数组。可惜 for/in 不能保证属性的顺序,但是大多数情况下都希望按照 阿拉伯数组顺序来产生元素。

    要想解决这个问题,我们可以用最常规的 for 来遍历数组。如下示例:

    var arr = [1,22,3,333,322,444];
     
    for(var i = 0;i < arr.length; i++){
        document.write("第" + i + "元素:" + arr[i] + "
    ");
    }

    4 函数

    4.1 第一种创建方式 函数声明

    alert(sum(3,11));  //弹出14
    function sum(x, y) {
        return x + y;
    }

    4.2 第二种创建方式 函数表达式

    alert(sum(3,11);   // unexpected identifier 意外标识符错误
    var sum = function (x, y) {
        return x + y;
    }

    语法: var funcName = fucntion(参数){ 代码 }

    两种方式都定义了一个函数,那它们两者的区别是什么?

    上述中第二段代码运行会产生错误,因为在执行到函数所在的语句之前,变量sum 中不会保存有对函数的引用;而且由于第一行代码就会报错,也不会执行到下一行。

     4.3 函数的调用方式

    4.3.1 方法调用模式 当一个函数被保存为对象的一个属性时,我们称它为一个方法, myObj.sum();

    4.3.2 函数调用模式 函数调用模式即通常的函数调用,属于全局性调用, sum(x, y);

    4.3.3 函数调用模式JavaScript中函数还可以是构造器. 将函数作为构造器来使用的语法就是在函数调用前面加上一个new关键字

    var add = function() {
        this.name = "汇智网";
        this.sum = function (a, b){
            return a + b;
        }
    }
    // 构造器调用模式
    var obj = new add(); //obj是一个对象
    obj.sum(1,2);  //=>3
    View Code

    上述中的代码创建了一个构造函数add,然后使用构造函数创建对象obj。这里使用了new关键字。然后使用对象调用sum()方法。

    4.3.4 JavaScript中函数也是对象,也可以拥有方法。其中call()和apply()用来间接的调用函数。称之为apply调用模式。

    apply方法让我们构建一个参数数组传递给调用函数。它也允许我们选择this的值。 apply方法接收两个参数,第一个是要绑定给this的值,第二个就是一个参数数组。

    语法:函数名.apply(对象, 参数数组);

    var add = function (a, b) {
        return a + b;
    }
     
    add.apply(null,[1,2]);  //=>3

    call方法与apply方法类似,区别在call第二参数不是一个数组而是需要列举出来。比如上述中的代码用call方法来实现,如下

    var add = function (a, b) {
        return a + b;
    }
    add.call(null,1,2); //=>3
  • 相关阅读:
    Python基础第十五天:初始面向对象
    Python基础第十四天:模块和包
    支付宝支付,邮件发送,短信推送,微信推送
    滑动验证
    Haystack全文检索
    Celery完成定时任务
    scrapy框架
    手机app抓包
    MongoDB数据库
    xpath解析数据
  • 原文地址:https://www.cnblogs.com/fuzzier/p/6351868.html
Copyright © 2011-2022 走看看