js面向对象--基础知识(1)

面向对象(Object Oriented,OO)是当前计算机界关心的重点,它是90年代软件开发方法的主流。面向对象的概念和应用已超越了程序设计和软件开发,扩展到很宽的范围。如数据库系统、交互式界面、应用结构、应用平台、分布式系统、网络管理结构、CAD技术、人工智能等领域。
  从世界观的角度可以认为
  1、面向对象的基本哲学是认为世界是由各种各样具有自己的运动规律和内部状态的对象所组成的;
  2、不同对象之间的相互作用和通讯构成了完整的现实世界。
  因此,人们应当按照现实世界这个本来面貌来理解世界,直接通过对象及其相互关系来反映世界。这样建立起来的系统才能符合现实世界的本来面目。
  从方法学的角度可以认为
  1、面向对象的方法是面向对象的世界观在开发方法中的直接运用;
  2、它强调系统的结构应该直接与现实世界的结构相对应,应该围绕现实世界中的对象来构造系统,而不是围绕功能来构造系统。

总的来说,面向对象就是对面向过程的一种封装,只不过面向对象更看重的是结果而不关注过程是什么样子的!


JavaScript三个组成部分:

  • DOM:Document Object Model 文档对象模型
    DOM树,本身为我们操作页面提供了一套方法(API),API即application programming interface,应用程序编程接口
  • BOM:Browser Object Model 浏览器对象模型
    核心对象(window location)
  • ECMAScript:规定了js的语法规则,js语句,关键字,保留字

基本类型和复杂类型:

  • 基本数据类型(简单数据类型)
    string 字符串类型
    number 数值
    boolean 布尔类型
    undefine 未定义
    null 空(对象)

  • 复杂数据类型
    Object 对象类型
    Array 数组类型
    Date 日期类型
    Function 函数类型
    String
    Number
    Boolean

注意:复杂数据类型中的String、Number、Boolean是JS中的内置函数

如何判断数据的数据类型:typeof 关键字,返回值是string类型

var a = "字符串";
    console.log(typeof (typeof a));  //string
    var b = 10;
    console.log(typeof b); //number
    var c = true;
    console.log(typeof c);//boolean

    var d = null;
    console.log(typeof d);//object

    var arr = [1,2,3];
    console.log(typeof arr);//array or object
    //结论:复杂数据在使用typeof操作的时候,打印出来的结果都是object ,除了函数
    console.log(typeof function funcName() {

    }); //Function

    //01 变量的值会为null吗
    //变量的值不可能为null,除非我们手动的赋值为null
    var test;
    console.log(test); //undefined
    test = null;

    //02 什么时候要设置为null
    //我们需要解除引用的时候

赋值运算符

等于符号(==)
比较的时候只判断数值是否是相等的
全等符号(===)
比较的时候不仅要比较数据还需要比较类型
不等于(!=)
不全等于(!==)

var str1 = "让我掉下眼泪的,不止你的温柔";
    var str2 = "让我掉下眼泪的,不止你的温柔";
    console.log(str1 == str2);

    var test1 = 1;
    var test2 = "1";
    console.log(test1 == test2);    //true
    console.log(test1 === test2);  //false

    //数组是引用(地址)类型,存储的是指向具体数据的地址(引用)
    var arr1 = [1,2,3]; //0x11
    var arr2 = [1,2,3]; //0x22
    console.log(arr1 == arr2);  //true or (false)

关系运算符

返回值:布尔类型,要么是true要么是false
大于 >
小于 <
大于等于 >=
小于等于 <=

逻辑运算符

逻辑非(!) 取反
逻辑或(||)
语法:表达式1 || 表达式2
结果:
判断表达式1,如果表达式1为真,那么就返回表达式
如果表达式1的值为假,那么就返回表达式2

    var resultA = 3 || 2;   //3
    var resultB = 0 || 2;   //2
    var resultC = 5 || 0;   //5
    var resultD = 0 || 0;   //0

逻辑与(&&)
语法:表达式1 && 表达式2
结果:
如果表达式1为真,返回表达式2
如果表达式1为假,返回表达式1

    var resultA = 3 && 2;   //2
    var resultB = 0 && 2;   //0
    var resultC = 5 && 0;   //0
    var resultD = 0 || 0;   //0

值类型和引用类型

  • 值类型
    string
    number
    boolean
    undefine
  • 引用类型
    object类型
    值类型:存储的是具体的值
    引用类型:存储的是只想具体值的地址

重点:赋值(=):把右边的数据复制一份给左边
值类型赋值:
1.把右边变量存储存储的值(具体的数据)复制一份给左边的变量
2.值类型的赋值:是简单数据的复制,他们保存在相对独立的空间中,彼此不会影响

引用类型:
1. 把右边变量存储存储的值(指向具体数据的地址)复制一份给左边的变量
2.引用类型赋值:修改了某个对象的属性,对另外一个对象的属性会有影响

    var str1 = "烟雨蒙蒙";
    var str2 = str1;
    str1 = "晴空万里";
    console.log(str1);//晴空万里
    console.log(str2);//烟雨蒙蒙

    var obj1 = {
        name:"张老汉"
    }
    var obj2 = obj1;
    obj1.name = "老王";
    console.log(obj1.name);//老王"
    console.log(obj2.name);//老王"

函数里面的相关术语

  • 实参(实际参数):
  • 形参(形式参数):占用的变量,没有调用函数的时候形参是没有值
    函数的调用:默认会把实参的值赋值给形参

值类型作为函数的参数:

  • 实参和形参他们的数据是相互独立的
    引用类型作为函数的参数
  • 形参和实参共享同一份数据,修改其中的某个对象对另外一个对象也会有影响

对象的动态特性

已经定义好的对象,我们可以动态的来进行操作:增加|删除|修改
访问对象有两种形式:

  • 点语法
  • [ ] 方括号语法
//01 创建对象
    var obj ={};
    //02 动态的为已经创建的对象添加属性
    obj.name = "黄小华";
    console.log(obj.name);

    //03 添加方法
    obj.sayHello = function () {
        console.log("hello");
    };

    obj.sayHello();

    //04 修改已经存在对象的属性值
    obj.name = "黄日华";
    //小结:在使用点语法设置对象的属性的时候,如果对象中不存在改属性,就是增加操作
    //如果对象中已经存在改属性,那么就是修改操作

    //05 删除对象中属性
    console.log(obj.name);
    delete obj.name;
    console.log(obj.name);  //null or (undefined)
    //01 创建对象
    var obj ={};
    //02 动态的为已经创建的对象添加属性
    //对象:键-值(key-value)对的集合
    //注意点:在使用[]语法的时候,键应该使用双引用
    obj["name"] = "黄小华";
    console.log(obj.name);

    //再增加一个属性
    obj["background color"] = "黑色";
    console.log(obj["background color"]);

    //03 添加方法
    obj["sayHello"] = function () {
        console.log("hello======");
    };

    obj["sayHello"](); //不推荐这样写

    //04 修改已经存在对象的属性值
    obj["name"] = "黄日华";
    //小结:在使用点语法设置对象的属性的时候,如果对象中不存在改属性,就是增加操作
    //如果对象中已经存在改属性,那么就是修改操作

    //05 删除对象中属性
    console.log(obj.name);
    delete obj["name"];
    console.log(obj.name);  //null or (undefined)


    //创建对象
    var date = new Date();
    var o = new Object();
    console.log(date);
    //GMT 格林尼治时间

in关键字用法

  • 遍历对象
    var obj = {
        name:"苹果",
        color:"黑苹果"
    };
    for(var key in obj) {
        console.log(key, obj[key]);
    }
  • 查找某对象中是否有某属性
//注意点:在使用in关键字的时候,key是字符串,需要加上双引号
    var isInclude = "name" in obj;
    console.log(isInclude) ;

delete关键字

delete 关键字的用法
01 删除对象中的实例属性
02 删除未使用var声明的变量
delete 使用的注意点
01 它是有返回值的,它的值是布尔类型
02 不能删除var 声明的变量
03 可以删除直接定义在window上面的属性,但是无法删除全局变量(var)

//01 删除对象中的实例属
    var obj = {
        name:"小黄",
        color:"黄色"
    };

    console.log(delete obj.age);  //返回值 true
    console.log(obj.color);
    console.log(delete obj.color);;
    console.log(obj.color); //null or (undefined)

    // 02 删除未使用var声明的变量
    //没有使用var关键字声明的变量是全局变量,自动成为window的属性
    test = "这是一个没有使用var关键字声明的变量";
    console.log(test);

    delete test;
    //console.log(test);  //报错
    console.log(window.test); //undefined

    //03 能够删除使用var关键字声明的变量吗? 不能
    var testVar = "使用var声明的变量";
    console.log(delete testVar); //false
    console.log(testVar);   //使用var声明的变量

    //能够删除成功
    window.nameDemo = "demo";
    console.log(window.nameDemo);   //demo
    delete window.nameDemo;
    console.log(window.nameDemo);

    //无法删除成功
    var demo = "demo------";

end

javaScript之面向对象初级二

聪明出于勤奋,天才在于积累。——华罗庚

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 216,591评论 6 501
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 92,448评论 3 392
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 162,823评论 0 353
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,204评论 1 292
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,228评论 6 388
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,190评论 1 299
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,078评论 3 418
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,923评论 0 274
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,334评论 1 310
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,550评论 2 333
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,727评论 1 348
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,428评论 5 343
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,022评论 3 326
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,672评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,826评论 1 269
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,734评论 2 368
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,619评论 2 354

推荐阅读更多精彩内容

  • 第5章 引用类型(返回首页) 本章内容 使用对象 创建并操作数组 理解基本的JavaScript类型 使用基本类型...
    大学一百阅读 3,233评论 0 4
  • 国家电网公司企业标准(Q/GDW)- 面向对象的用电信息数据交换协议 - 报批稿:20170802 前言: 排版 ...
    庭说阅读 10,960评论 6 13
  • importUIKit classViewController:UITabBarController{ enumD...
    明哥_Young阅读 3,802评论 1 10
  • 前一阵子公司电影节办影展,有一场让我印象深刻。当时放的是一个新晋导演的处女座,讲九十年代深圳移民的故事。镜头跟随一...
    司昀阅读 650评论 0 2
  • 关于朋友,五湖四海三教九流友人众多,不老少的都是自作孽不可活,但为人之友,该帮的依旧不遗余力,该使的不客气,望钱财...
    纵情嬉戏天地间阅读 127评论 0 0