索鸟网

  1. 首页
  2. mianxiangduixiang

mianxiangduixiang


一、基本知识点

1.JavaScript 基本组成

3部分构成:ECMAScript、BOM、DOM。

2.数据类型

简单数据类型:number、boolean、string、null、undefined
复杂数据类型:object
内置对象:Array、Date、Math、Number、Bollean、String、Function、Error、RegExp

判断数据类型:typeof 返回结果是string类型

 console.log(typeof (typeof []));   //string
 console.log(typeof function () {});//function
 console.log(typeof  NaN);          //number
 console.log(typeof 1);             //number
 console.log(typeof true);          //boolean
 console.log(typeof "12");          //string
 console.log(typeof null);          //object
 console.log(typeof undefined);     //undefined
 console.log(typeof []);            //object

3.运算符

算术运算符 + %
作用:1、算术运算2、字符串拼接3、强制转换为number类型

%取余数

逻辑运算符 && || !

&&
从左往右依次运算,把要运算的数值转换为boolean类型,如果为false,
则返回这个值,否则一直往后查找,如果没有找到,返回最后一个值。
console.log(11 && 22 && 33); // 33
console.log(0 && NaN && 33); // 0
||
从左往右依次运算,把要运算的数值转换为boolean类型,如果为true,
则返回这个值,否则一直往后查找,如果没有找到,返回最后一个值。
console.log(0 || NaN || false); // false
console.log(1 || NaN || false); // 1
!
所有的对象转换为boolea类型都为true,所以![] ==》 false。
两次!!,能给把一个数据转换为boolean类型。

4. 比较

== 值判断,先转换数据类型再比较。
=== 全等,比较值和数据类型。

比较规律:
// NaN 和任何数据比较,结果都为false
// null 和 其他数据类型比较,结果都为false,undefined除外
// undefined 和 其他数据类型比较,结果都为false,null除外
// 对象与对象比较,比较的是地址
// 对象与字符串比较,会把对象转换为字符串之后再比较
// 其他数据类型(null和undefined除外)和数值比较时,会把其他数据类型转换为数值再比较
// 其他数据类型(null和undefined除外)和布尔比较时,会把两边数据都转换为数值再比较

5.布尔类型转换

如何把数据转换为布尔类型?               !! Boolean
哪些数据在转换为布尔类型时结果为false?   0、null、""、""、NaN、undefined。

6.函数

创建方式 1、函数声明式 2、函数表达式 3、Function
arguments length属性,代表实参的个数,是一个伪数组。

二、面向对象

注意:原型简写,不要使用现成的对象

1. 概念

1.1 原型的概念

在创建函数的时候,js会自动创建一个对象,这个对象就是原型,同时把函数的prototype属性添加一个指针指向这个原型对象。通过构造函数创建的对象,都继承这个原型对象(新创建的对象的__proto__添加一个指针指向构造函数的原型属性)。
原型就是函数一个属性,它本身是一个对象。

1.2 原型对象和原型属性

(隐式原型对应原型对象__proto__、显式原型对应原型属性prototype)
原型对象是相对于对象来说的,它指的是对象的__proto__。
原型属性是相对于构造函数来说的,它指的是构造函数的prototype。

1.3 原型链的概念 ==> 原型链长度问题

原型链:从一个对象的__proto__开始,到Object.prototype.__proto__ 为null的这条结构,就叫原型链。以__proto__组织起来的一串原型对象,这一串原型对象就叫原型链.

所有的对象都有原型对象,同时原型对象还有原型对象,一直到Object.prototype为止;
从对象开始,到Object.prototype结束,以及中间由__proto__串联起来的所有原型对象,共同构造了原型链。

1.4 内置对象原型链结构

实例的__proto__属性指针指向的是对应的类型的构造函数的prototype属性。
所有的构造函数原生的原型属性(构造函数.prototype),它的__proto__属性指针指向的是Object.prototype。
Object.prototype.__proto__指针指向的是null。

2. new关键字执行步骤

    function F() {}
    var obj = new F();

    /*
    * 代码执行的步骤:
    * 1、函数被声明
    * 2、初始化函数、给函数添加一些属性、name、prototype = { construtor : F }
    * 3、声明了一个obj变量
    * 4、new F() 创建了一个新对象
    * 5、new F() 创建的新对象初始化,给它添加一个属性:__proto__ = F.prototype
    * 6、执行构造函数F
    * 7、把new F()创建的对象赋值给变量obj
    * */

3. 继承方式

    // 第一种
    // o就继承了F.prototype
    function F(){}
    F.prototype.run = function(){};
    var o = new F();
    
    // 第二种
    // oo就继承了改写后的匿名字面量对象
    function FF() {}
    FF.prototype = {};
    var oo = new FF();
    
    // 第三种,原型与extend继承的组合
    // ooo就继承了FFF.prototype
    // FFF.prototype 继承了 任意对象(有些地方说这也叫继承,叫copy继承)
    // 函数extend:把obj2对象中的属性依次复制到obj上
    function extend(obj, obj2) {
        for (var key in obj2) {
            obj[key] = obj2[key];
        }
    }
    function FFF() {}
    //extend(FFF.prototype, 任意对象);
    var ooo = new FFF();
    
    // 第四种
    // oooo就继承了任意对象
    // 定制化原型对象
    // var oooo = Object.create(任意对象);
    // Object.create 是ES5提供的方法 IE9以前不支持
    
    // 第五种
    // 原型配合Object.create
    function FFFFF() { }
    // FFFFF.prototype = Object.create(任意对象);
    // ooooo间接继承了任意对象
    var ooooo = new FFFFF();
    
    //  第六种 
    间接继承方式1:覆盖构造函数的原型属性,让该属性的指针指向另外一个对象,这个对                        
    象继承实例真正要继承的对象。
    var itcast = {
        name : "张三"
    };
    function Fn() {}
    Fn.prototype = Object.create(itcast);
    var obj = new Fn()

4 图


javascript

来源地址:https://segmentfault.com/a/1190000011475376 版权归作者所有!