用chrome学编程

本文通过简单的示例介绍如何使用Chrome进行编程,包括打印“Hello World”、制作九九乘法表及编写时钟插件等内容,适合编程初学者快速上手。

#利用chrome学编程,一切都变得简单...

用chrome学编程,安装浏览器就可以上手,javascript本身也足够强大,前后端通吃,容易出成果,有了成果产生的成就感也就有了持续学习编程的动力...

###编辑器在哪里?

##(一) 孩子第一次开口都叫"妈妈",我们第一次编程要打印"Hello world"!

源码: alert("Hello World");

为什么第一次要打印Hello world? Hello world是程序员的符号和图腾,第一本介绍C语言的书《C程序设计语言》,书的第一章通过打印Hello world介绍了c语言,后来人们也都跟着用了... 其实Hello world你可能一辈子也用不到,你也可以打印Hello girl

##(二) 九九乘法表!

####先放一张童年阴影:

记得小学二年级背诵"小九九",老师为了检验学生背诵熟练度,发明了2种检测方式:

####广度检测:

学生按座位次序(这个不流行摇号...),到讲台背乘法表,通过回座位,不通过继续排队(小学生不容易额~~).

####深度检测:

其实像"小九九"乘法表这种问题,编程几句就可以搞定,而且不出错!

源码:

function jiujiu() {
    // 存储每一行的数据
    var result = "";

    for (var i = 1; i <= 9; i++) {
        // 清空上一行的数据
        result = "";
        for (var j = 1; j <= i; j++) {
            // 表示每一句运算口诀
            con = i + "*" + j + "=" + i*j;          
            result = result + " " + con;
        }
        // 打印每一行的数据
        console.log(result + "\n");       
    }
}
// 调用刚刚写好的函数
jiujiu();
复制代码

####九九乘法表涉及了编程的循环(负责从一数到九),函数(决定什么时候开始数)...

循环就是让计算机做重复的工作:

####这里面的i被称为变量,负责计数,计算机每完成一次,i就会加一,当累加到十的时候,任务完成!

for(var i = 1; i<=10; i++){

    alert("这是第"+i+"个弹窗");
    
}

复制代码

####这里面的function就是函数,函数是一个功能,它可以简单而无聊,也可以复杂而强大...

####但一个好的函数可以简单而强大...

##(三) 函数为chrome写扩展

####chrome扩展可以看做是浏览器的一个小插件,这次我们就用函数为chrome写一个时钟...

源码:

function my_clock(clock_div){
	// 获取今天的日期	
	var today = new Date();
	// 获取当前的"时"	
	var h = today.getHours();
	// 获取当前的"秒"	
	var m = today.getMinutes();
	// 获取当前的"秒"	
	var s = today.getSeconds();

	// 为了美观, 当"分钟数"小于十的时候在个位数的前面补一个零
	m = m >= 10? m: ('0'+m);
	// 为了美观, 当"秒钟数"小于十的时候在个位数的前面补一个零
	s = s >= 10? s: ('0'+s);

	// 将刚刚得到的数据拼接好,插入到结点中
	clock_div.innerHTML = h+":" + m + ":" + s;
	// 每隔1000毫秒(一秒钟)更新一次时间	
	setTimeout(function(){my_clock(clock_div)}, 1000);
}

// 通过Id获取元素结点
var clock_div = document.getElementById("clock_div");

// 将元素结点传入my_clock函数

my_clock(clock_div);

复制代码

简单与强大并不矛盾,getHours, getMinutes, getSeconds是系统内置的函数,我们简单调用它们,它们为程序员提供强大的功能.

##如何获取独立IDE?


教程涉及到的资源我都通过百度网盘分享给大家,为了便于大家的下载,资源整合到了一张独立的帖子里,链接如下: http://www.jianshu.com/p/4f28e1ae08b1

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值