面向对象的JS(一)

 /*JavaScript和其他的语言类似,也是面向对象,自然也就是存在类和对象(对象是类的实例化)*/
        //1、JS对象
        var empty = {};    //没有任何属性的对象
        var point = { x: 0, y: 0 };      //两个属性和值
        var point2 = { x: point.x, y: point.y }    //复杂的属性和值
        var book = {
            "main title": "javascript",            //属性名字中有空格,必须用字符串表示
            "sub-title": "The Definitive Guide",   //属性名字里有连字符,必须用字符串表示
            "for": "all audiences",                //for是保留字,因此必须用引号
            author: {                              //属性为对象类似其他语言
                firstname: "David",                //这个属性的值是一个对象,因此属性没有使用引号
                surname: "Flanagan"
            }
        };

        //2、通过new创建对象
        var o = new Object();                     //创建空对象,和{}一样
        var a = new Array();                      //创建一个空数组,和[]一样,这里的数组对象是JavaScript自带的对象
        var d = new Date();                       //创建时间对象
        var p = new point();                      //创建自己定义的对象

        //3、属性的查询和设置(可以通过“.”和“[]”来获取属性值,前者右侧必须是属性名称,后者括号内必须是一个字符串表达式)
        var author = book.author;
        var name = author.surname;
        var title = book["main title"];

        book.edition = 6;                         //给book创建一个名为“edition”的属性
        book["main title"] = "ECMAScript";        //给“main title”重新赋属性值

        //4、继承(JavaScript对象具有“自有属性”,也有些是从原型对象继承而来的,构成一条“链”)inherit()函数,通过给它传入指定原对象来创建实例
        var o = {};   //或者var o=new Object();
        o.x = 1;
        var p = inherit(o);     //p继承o和object
        p.y = 2;
        var q = inherit(p);     //q继承o、p和object
        q.z = 3;
        var s = q.toString();    //toString继承object
        var result = q.x + q.y;
        alert(result);           //result为3 ,x和y继承o和p

        //注意:属性赋值,但是不会修改原型链,设置属性和继承无关
        var circle = { r: 1 };      //设置圆形半径r为1
        var c = inherit(circle);    //c继承r
        c.x = 1;
        c.y = 1;
        c.r = 2;
        var l = circle.r;
        alert(l);                   //l为1,原型对象属性没有修改
时间: 2024-08-02 15:19:57

面向对象的JS(一)的相关文章

面向对象的js编程 Call和apply方法

JavaScript中有一个call和apply方法,其作用基本相同,但也有略微的区别. 一.方法定义 1.call 方法 语法:call([thisObj[,arg1[, arg2[, [,.argN]]]]]) 参数 thisObj  可选项.将被用作当前对象的对象. arg1, arg2,  , argN 可选项.将被传递方法参数序列. 说明 call 方法可以用来代替另一个对象调用一个方法.call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象.  

深入javascript面向对象,js的原型链、继承

进阶面向对象----------------------– 在JS源码中,系统对象也是基于原型的程序, 尽量不要去添加和修改系统对象的方法 包装对象----------------------– 基本类型都有自己对应的包装对象 比如String Number Boolean 基本类型会找到对应的包装对象类型,然后包装对象把所有的属性方法给了 基本类型,然后包装对象消失 例如 var str = 'abc'; str.num = 10; //创建一个包装对象,给包装对象加num属性,然后立刻消失.

JavaScript面向对象(一)——JS OOP基础与JS 中This指向详解

  前  言 JRedu 学过程序语言的都知道,我们的程序语言进化是从"面向机器".到"面向过程".再到"面向对象"一步步的发展而来.类似于汇编语言这样的面向机器的语言,随着时代的发展已经逐渐淘汰:而面向过程的语言也只有C语言老大哥依然坚挺:现在主流的语言(例如Java.C++.PHP等)都是面向对象的语言. 而我们的JavaScript语言,恰恰介于面向过程与面向对象之间,我们称它为"基于对象"的语言.但是,JS中的OOP依

面向对象的JS

原型(prototype):所有的JS对象都可以通过其原型来扩展,并且这个功能允许创建自定义类. /* var answer = 0;//代码味太浓,不在局部作用域意味着可以在程序的任何部分被修改 function addNumbers(num1, num2) { answer = num1 + num2; } //每个函数都是孤立的存在于全局作用域内,污染了全局作用域 function subtractNumbers(num1, num2) { answer = num1 - num2; }

面向对象编程js

几种模块化js编程demo var module1 = new Object({ _count:1, m1:function(){ console.log("m1 method start..."); }, m2:function(){ console.log("m2 method start..."); } }); module1.m1(); console.log(module1._count); var module2 = (function(){ var _

面向对象认识js

对象的作用是什么? •把和某个主题有关的功能等放在一起,统一管理. •比如浏览器分成window对象,document对象 •分别放置了和这个对象有关的一些操作,我们不用关心实现细节,直接使用. 函数的作用是什么? •封装细节 其实对象就是一个函数容器 •函数封装细节,对象可以将几个函数放在一起,对象就类似一个容器,以后我再想使用某个函数,可以从这个容器里面寻找对应的函数即可 原型对象本质 •通过原型创建对象,其实创建的是两个对象 –构造函数对象 –原型对象 •当我们实例化的时候,该实例自动拥有

面向对象的js写法

<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>     <title></title>     <style>         *{paddi

对象(类)的封装方式(面向对象的js基本知识)

上一个月一直忙于项目,没写过笔记,今天稍微空下来了一点 前几天在写项目的时候关于怎么去封装每一个组件的时候思考到几种方式,这里总结一下: 1.构造函数方式(类似java写类的方式):把所有的属性和方法全部挂在构造函数内部的this上: 1 function Textarea(opts) { 2 this.defaults = { 3 //...这是一些默认属性 4 }; 5 this.options = $.extend(true, {}, this.defaults, opts); 6 thi

面向对象原生js幻灯片代淡出效果

下面是代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Co