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>

javascript基础05的更多相关文章

JavaScript基础05——严格模式
严格模式: 除了正常运行模式,ECMAscript5添加了第二种运行模式:“严格模式”(strict mode).顾名思义,这种模式是的Javascript在更严格的条件下运行. 严格模式的作用: 1 ...
JavaScript基础入门05
目录 JavaScript 基础入门05 严格模式严格模式的设计目的如何开启使用严格模式显式报错字符串字符串的创建字符串实例方法之常用API JavaScript 基础入门05 严格模式 ...
JavaScript基础第05天笔记
JavaScript基础第05天笔记 1 - 作用域 1.1 作用域概述通常来说,一段程序代码中所用到的名字并不总是有效和可用的,而限定这个名字的可用性的代码范围就是这个名字的作用域.作用域的使用提 ...
javaScript基础之闭包
不管是Jquery还是EXTJS,现代的js框架中大量应用了js的一些特性,比如:匿名函数,闭包等等,导致源代码非常难以阅读. 不过要想真正的使用好前台的UI技术,还是需要去深入的理解这些概念. ...
JavaScript基础视频教程总结（031-040章）
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
JavaScript学习(1)之JavaScript基础
JavaScript学习(1)之JavaScript基础由于工作原因,开发语言逐渐以JavaScript为主,所以,抽空学习了下JavaScript语法.等现阶段的工作稳定之后,陆续会分享下自己在学 ...
JavaScript基础语法资料
JavaScript基础第01天 1 - 编程语言 1.1 编程编程: 就是让计算机为解决某个问题而使用某种程序设计语言编写程序代码,并最终得到结果的过程. 计算机程序: 就是计算机所执行的一系列的 ...
JavaScript基础
JavaScript基础 JavaScript是一门编程语言,浏览器内置了JavaScript语言的解释器,所以在浏览器上按照JavaScript语言的规则编写相应代码之,浏览器可以解释并做出相应的处 ...
一步步学习javascript基础篇（0）:开篇索引
索引: 一步步学习javascript基础篇(1):基本概念一步步学习javascript基础篇(2):作用域和作用域链一步步学习javascript基础篇(3):Object.Function等 ...

随机推荐

Unity UI on hololens
http://heliosinteractive.com/scaling-ui-hololens/ https://forum.unity3d.com/threads/unity-ui-on-the- ...
生产环境使用 pt-table-checksum 检查MySQL数据一致性
公司数据中心从托管机房迁移到阿里云,需要对mysql迁移(Replication)后的数据一致性进行校验,但又不能对生产环境使用造成影响,pt-table-checksum 成为了绝佳也是唯一的检查工 ...
JS判断字符串长度的5个方法
这篇文章主要介绍了JS判断字符串长度的5个方法,并且区分中文和英文,需要的朋友可以参考下目的:计算字符串长度(英文占1个字符,中文汉字占2个字符) 方法一: 代码如下: String.pr ...
C#进阶系列——DDD领域驱动设计初探（六）：领域服务
前言:之前一直在搭建项目架构的代码,有点偏离我们的主题(DDD)了,这篇我们继续来聊聊DDD里面另一个比较重要的知识点:领域服务.关于领域服务的使用,书中也介绍得比较晦涩,在此就根据博主自己的理解谈谈 ...
bootstrap快速搭建属于自己的后台模板库
不论做什么项目,我们都以快速搭建为主,设计师固然重要,但是,我们前端开发的也必须能给出自己以前做过什么样的模板,自己收藏的模板,或者我们弹框的形式,我的提示框的形式,我用的下拉框的插件,日历的插件,我 ...
点击弹出li所在的序列号
最近在研究一个图片替换功能,及点击左侧商品在右侧弹出层修改图片后,同时左侧的图片也得跟着修改. 我原来考虑的添加ID作为唯一值.但当ID重复了,替换就出BUG了. 最后问公司同事,然后给提供了根据点 ...
[MAVEN]二、常用命令
mvn eclipse:eclipse :生成 Eclipse 项目文件,生成后可以导入到eclipse中使用 mvn install :在本地 Repository 中安装 jar ,若是Web项目 ...
pod setup 安装的最新办法（大坑啊）
由于升级到10.11以后安装cocodpods难免会碰到各种问题,下面有列举出不同的解决办法,建议一个方法如果不行,把文件请了再用第二种方法, 流程是这样的:正常安装-->碰到问题-->查 ...
ED2k Resource
http://www.lwkk.com/ http://www.ed2000.com/
Traditional Language Model
Traditional Language Model通常用于回答下述问题: How likely is a string of English words good English ? \(p_{LM ...

javascript基础05

javascript基础05的更多相关文章

随机推荐

热门专题