javascript基础05

1、变量的作用域

变量既可以是全局,也可以是局部的。

全局变量:可以在脚本中的任何位置被引用,一旦你在某个脚本里声明了全局变量,你就可以

在这个脚本的任何位置(包括函数内部)引用它,全局变量的作用域是整个脚本;

局部变量:只存在于对它做出声明的函数内部,在函数的外部无法相用它,局部变量的作用域

仅限于函数内部;

function square(num){
        var total;
        total = num * num;
        return total;
    }
    var total = 50;
    alert(total);
    var number = square(20);
    alert(total);

2、JavaScript 内部函数

在javascript中有一些功能是很常用的,它们以全局函数的形式提供给用户,这些函数称为内

部函数。

parseInt 和 parseFloat 将字符串转换为数字

3、escape 和 unescape  进行URL编码和解码 

var url = “http://www.baidu.com/s?name=小米”;
    url = escape(url);
    alert(url);
    alert(unescape(url));

4、对象

avascript是一种面向对象的语言,因此可以使用面向对象的思想来进行

javascript程序设计

对象就是由一些彼此相关的属性和方法集合在一起而构成的一个数据实体。

本地对象

1.Date 日期对象用来处理日期和时间。

var myDate = new Date();
myDate.getFullYear();    //获取完整的年份(4位,1970-????)
myDate.getMonth();       //获取当前月份(0-11,0代表1月)
myDate.getDate();        //获取当前日(1-31)
myDate.getDay();         //获取当前星期X(0-6,0代表星期天)
myDate.getTime();        //获取当前时间(从1970.1.1开始的毫秒数)
myDate.getHours();       //获取当前小时数(0-23)
myDate.getMinutes();     //获取当前分钟数(0-59)
myDate.getSeconds();     //获取当前秒数(0-59)
myDate.getMilliseconds();    //获取当前毫秒数(0-999)
myDate.toLocaleDateString();     //获取当前日期
var mytime=myDate.toLocaleTimeString();     //获取当前时间
myDate.toLocaleString();        //获取日期与时间    
2.Math 对象

Math 对象用来处理复杂的数学运算。
Math对象是javascript的一个全局对象,不需要用new 创建

Math.abs(-2);           该方法可返回一个数的绝对值。

Math.round(5.5);      该方法可把一个数字舍入为最接近的整数。

Math.random();      该方法可返回介于 0(包含) ~ 1(不包含) 之间的一个随机数。

Math.ceil(1.4);         ceil()   方法返回大于等于x的最小整数。(取大整)

Math.floor(1.6);       floor() 方法返回小于等于x的最大整数。(取小整)

Math.pow(4,3);        pow() 方法返回 x 的 y 次幂。  (4的3次方)

作业题:

最简单的表格和时间封装,写出复杂的面向对象,我也是闲的无聊啊。

你是猪吗?这么简单的封装函数,写出这个什么鬼。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表格输出</title>
    <script>
        window.onload=function(){
            var tb=new Table("body",5,5,{bg:"#000"});
            var tb1=new Table("body",5,5,{bg:"#eee"});
            var tb2=new Table("body",5,5,{bg:"#0ff"});
            var tb3=new Table("body",5,5,{bg:"#f0f",circle:true});
        }

        function Table(obj,r,c,json){
            this.str=‘‘;
            this.obj=document.querySelector(obj);
            this.init(json);
            this.create(c,r);
        }

        Table.prototype.init=function(json){
            this.setting={
                border:"1px solid #000",
                bg:"#fff",
                w:40,
                h:30,
                circle:false,
            };
            extend(json,this.setting);
        }

        Table.prototype.create=function(c,r){
            var createE=document.createElement("div");
            this.str=‘<table>‘;
            for(var i=0;i<r;i++){
                this.str+="<tr>";
                for(var j=0;j<c;j++){
                    if(this.setting.circle){
                        this.str+=‘<td style="width:‘+this.setting.w+‘px;height:‘+this.setting.h+‘px;border:‘+this.setting.border+‘;background:‘+this.setting.bg+‘;border-radius:50%;"></td>‘;
                    }else{
                        this.str+=‘<td style="width:‘+this.setting.w+‘px;height:‘+this.setting.h+‘px;border:‘+this.setting.border+‘;background:‘+this.setting.bg+‘;"></td>‘;
                    }
                }
                this.str+="</tr>";
            }
            this.str+=‘</table>‘;
            createE.innerHTML=this.str;
            this.obj.appendChild(createE);
        }

        function extend(obj,obj1){
            for(var attr in obj){
                obj1[attr]=obj[attr];
            }
        }
    </script>
</head>
<body>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>时间</title>
    <script>
        window.onload=function(){
            var b=new Time("body",{y:"/",m:"/",d1:"",color:"#0f0",size:20});
            var b1=new Time("body",{y:"-",m:"-",d1:"",color:"#ff0",size:26});
            var b2=new Time("body",{y:"|",m:"|",d1:"<br/>",color:"#f00",size:15});
        }

        function Time(obj,json){
            this.obj=document.querySelector(obj);
            this.CE=document.createElement("div");
            this.obj.appendChild(this.CE);
            var This=this;
            this.init(json);
            this.d();
            setInterval(function(){
                This.d();
            },1000);
        }
        Time.prototype.init=function(json){
            this.setting={
                y:"年",
                m:"月",
                d1:"日",
                d:":",
                color:"#000",
                size:16,
            }
            extend(json,this.setting);
        }

        Time.prototype.d=function(){
            var date=new Date(),
            y1=date.getFullYear(),
            m1=date.getMonth()+1,
            d1=date.getDate(),
            h=date.getHours(),
            i=date.getMinutes(),
            s=date.getSeconds(),
            w=date.getDay();
            str=‘‘;
            arr=["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];
            str=y1+this.setting.y+m1+this.setting.m+d1+this.setting.d1+" "+num(h)+this.setting.d+num(i)+this.setting.d+num(s)+" "+arr[w];
            this.CE.innerHTML=str;
            this.CE.style.cssText="font-size:"+this.setting.size+"px;color:"+this.setting.color+";";
        }

        function num(a){
            return a<10?"0"+a:""+a;
        }

        function extend(obj,obj1){
            for(var attr in obj){
                obj1[attr]=obj[attr];
            }
        }

    </script>
</head>
<body>

</body>
</html>

时间: 2024-12-14 16:57:34

javascript基础05的相关文章

JavaScript基础--内部类(九)

js的内部类javascript 中本身提供一些,可以直接使用的类,这种类就是内部类,主要有:ObjectArrayMathBooleanStringRegExpDateNumber 1.内部类分类从使用的方式看:分为动态类和静态类(1) 动态类 使用 var对象 = new 动态类() 对象属性|方法 var newdate = new Date(); //显示当前日期 window.alert(newdate.toLocaleString()); (2) 静态类 使用 类名.属性|方法比如:

javaScript基础之闭包

不管是Jquery还是EXTJS,现代的js框架中大量应用了js的一些特性,比如:匿名函数,闭包等等,导致源代码非常难以阅读. 不过要想真正的使用好前台的UI技术,还是需要去深入的理解这些概念.   在这里推荐几篇比较好的文章介绍javaScript基础: 当JavaScript从入门到提高前需要注意的细节:闭包部分:http://msdn.microsoft.com/zh-cn/library/hh968324.aspx 学习Javascript闭包(Closure):http://www.r

javascript入门书籍推荐《javascript基础教程》

前段时间看javascript高级教程的时候,发现很多基础的javascript概念,自己不懂. 网上搜了一下,看到大家对<javascript基础教程(第8版)>评价不错,买了一本. 作者: (美)Tom Negrino Dori Smith 译者: 陈剑瓯 柳靖 丛书名: 图灵程序设计丛书 出版社:人民邮电出版社 翻开看了后,受益匪浅,决定将这本书推荐给javascript的入门童鞋. 这本书的读者,要有一定的HTML基础,因为javascript基本都是对Dom的操作,所以,有一定的HT

js基础--javascript基础概念之语法

掌握一门语言 必须先掌握它的语法! javascript 的语法和C.Java.Perl 的语法有些相似.但是比它们更加宽松. javascript 中的一切都是严格区分大小写的.例如变量: demo 和 Demo 两个变量是完全不同的. javascript 标示符,所谓标示符 是指 变量.函数.属性 的名字或函数的参数.标示符的格式是按照以下规则组合的一个或多个字符. 1.第一个字符必须是字母,下划线,或 $ 符号. 2.其他字符可以是字母.下划线.$ . 或数字. 注意 不能把关键字 保留

Javascript.01 -- Javascript基础

Javascript基础 1 聊聊Javascript 1.1 Javascript的历史来源 94年网景公司   研发出世界上第一款浏览器. 95年 sun公司   java语言诞生 网景公司和sun合作. Java+script   ===> javascript 1.2 W3c规范 ?结构标准        html ?表现标准   css ?行为标准      js 1.3 JavaScript和ECMAScript的关系 ECMAScript是一种由Ecma国际前身为欧洲计算机制造商协

javascript基础学习(十五)

javascript之cookie 学习要点: cookie介绍 创建与获取cookie cookie的编码 cookie的生存期 cookie的路径 cookie的domain cookie的secure 一.cookie介绍 cookie实际上就是一些信息,这些信息以文件的形式存储在客户端计算机上.在javascript中,cookie主要用来保存状态,或用于识别身份. 二.创建与获取cookie 创建cookie的语法代码如下所示:document.cookie="name=value&q

javascript基础学习(八)

javascript之日期对象 学习要点: 日期对象 将日期对象转换为字符串 将日期对象中的日期和时间转换为字符串 日期对象中的日期 日期对象中的时间 设置日期对象中的日期 设置日期对象中的时间 与毫秒相关的方法 一.日期对象 在javascript中并没有日期型的数据类型,但是提供了一个日期对象可以操作日期和时间. 日期对象的创建: new Date(); 二.将日期对象转换为字符串 将日期对象转换为字符串可以使用以下4种方法: date.toString();//将日期对象转换为字符串时,采

javascript基础学习(二)

javascript的数据类型 学习要点: typeof操作符 五种简单数据类型:Undefined.String.Number.Null.Boolean 引用数据类型:数组和对象 一.typeof操作符 typeof操作符用来检测变量的数据类型,操作符可以操作变量也可以操作字面量. 对变量或值运用typeof操作符得到如下值: undefined----如果变量是Undefined类型: boolean-------如果变量是Boolean类型: number-------如果变量是Numbe

javascript基础语法——词法结构

× 目录 [1]java [2]定义 [3]大小写[4]保留字[5]注释[6]空白[7]分号 前面的话 javascript是一门简单的语言,也是一门复杂的语言.说它简单,是因为学会使用它只需片刻功夫:而说它复杂,是因为要真正掌握它则需要数年时间.实际上,前端工程师很大程度上就是指javascript工程师.前端入门容易精通难,说的是前端,更指的是javascript.本文是javascript基础语法的第一篇——词法结构 与java关系 关于javascript有这样一个说法,java和jav