关于全局变量和局部变量
1.局部变量
2
3 function aaa()
4 {
5 var a=10;
6 }
7 function bbb()
8 {
9 alert(a)
10 }
11 aaa()
12 bbb()
13 </script>
运行结果：错误: “a”未定义，a是局部变量，他只属于函数aaa，并不属于函数bbb
2.全局变量1
2 var a
3 function aaa()
4 {
5 var a=10;
6 }
7 function bbb()
8 {
9 alert(a)
10 }
11 aaa()
12 bbb()
13 </script>
运行结果：弹出undefined，这也是变量的类型之一，只不过是undefined类型，他并不同等与第一种的未定义
变量的类型是由赋给变量的值决定的，这个时候bbb函数里的a是全局变量，虽然var了，但是并没有指定值，所以是undefined
3.全局变量2
2 var a
3 function aaa()
4 {
5 a=10;
6 }
7 function bbb()
8 {
9 alert(a)
10 }
11 aaa()
12 bbb()
13 </script>
运行结果：10，a是全局变量并且通过函数aaa赋了值——10
ps：我们经常称undefined是未定义，都是通过1和2，是不是可以说undefined≠未定义呢
本文链接
最近在学习前端的性能优化，有必要了解一下页面的渲染流程，以便对症下药，找出性能的瓶颈所在。以下是我看到的一些东西，分享给大家。
参考：Understanding the renderer
页面的渲染有以下特点：
- 单线程事件轮询
- 定义明确、连续、操作有序（HTML5）
- 分词和构建DOM树
- 请求资源并预加载
- 构建渲染树并绘制页面
具体来说：
当我们从网络上得到HTML的相应字节时，DOM树就开始构建了。由浏览器更新UI的线程负责。当遇到以下情况时，DOM树的构建会被阻塞：
- HTML的响应流被阻塞在了网络中
- 有未加载完的脚本
- 遇到了script节点，但是此时还有未加载完的样式文件
渲染树构建自DOM树，并且会被样式文件阻塞。
由于是基于单线程的事件轮询，即使没有脚本和样式的阻塞，当这些脚本或样式被解析、执行并且应用的时候，也会阻塞页面的渲染。
一些不会阻塞页面渲染的情况：
- 定义的defer属性和async属性的
- 没有匹配的媒体类型的样式文件
- 没有通过解析器插入script节点或样式节点
下面，通过一个例子来说明一下（完整的代码）：
2 <body>
3 <link rel="stylesheet" href="/blog_article/example.css">
4 <div>Hi there!</div>
5 <script>
6 document.write('<script src="/blog_article/other.js"></scr' + 'ipt>');
7 </script>
8 <div>Hi again!</div>
9 <script src="/blog_article/last.js"></script>
10 </body>
11 </html>
代码很容易看明白，如果放在浏览器中打开会立即显示出想要的页面。下面，让我们用慢镜头回放的方式来看看它究竟是怎么渲染的。
2 <body>
3 <link rel="stylesheet" href="/blog_article/example.css">
4 <div>Hi there!</div>
5 <script>...
首先，解析器遇到了example.css，并将它从网络中下载下来。下载样式表的过程是耗时的，但是解析器并没有被阻塞，继续往下解析。接下来，解析器遇到script标签，但是由于样式文件没有加载下来，阻塞了该脚本的执行。解析器被阻塞住，不能继续往下解析。
渲染树也会被样式文件阻塞，所以这时候没有浏览器不会去渲染页面，换句话说，如果example.css文件下载不下来，Hi there! 是显示不出来的。
接下来，继续。。。
<body>
<link rel="stylesheet" href="/blog_article/example.css">
<div>Hi there!</div>
<script>
document.write('<script src="/blog_article/other.js"></scr' + 'ipt>');
</script>
一旦example.css文件加载完成，渲染树也就被构建好了。
内联的脚本执行完之后，解析器就会立即被other.js阻塞住。一旦解析器被阻塞，浏览器就会收到绘制请求，"Hi there!"也就显示在了页面上。
当other.js加载完成之后，解析器继续向下解析。。。
2 <body>
3 <link rel="stylesheet" href="/blog_article/example.css">
4 <div>Hi there!</div>
5 &l
When we are doing web programming using PHP, one problem is that the php files can be mixed with php code as long as the html code. At some point, it is not very clean and also not safe. And the work can't be seperated for back-end programmers and front-end programmers. So we need a tool to seperate the php logic from the html code to well organize the and maintain the developing process.So here it comes Smarty.
Smarty is a web template system written in PHP. Smarty is primarily promoted as a tool for separation of concerns.[1] Smarty is intended to simplify compartmentalization, allowing the presentation of a web page to change separately from the back-end. Ideally, this eases the costs and efforts associated with software maintenance.
Smarty generates web content by the placement of special Smarty tagswithin a document. These tags are processed and substituted with other code. Tags are directives for Smarty that are enclosed by template delimiters. These directives can be variables, denoted by a dollar sign ($), functions, logical or loop statements. Smarty allows PHP programmers to define custom functions that can be accessed using Smarty tags.
2. Set up SmartyStep1: download the Smarty and rename it's libs folder and import it into our php project.
Step2: create a php file to connect to Smarty( SmartyCon.php)
<?php
/*
* Created on Jan 10, 2013
* Author: Nick
* Function: Connecting to Smarty
*/
include_once("smarty/Smarty.class.php");
$smarty = new Smarty(); //new an instance of smarty
$smarty->config_dir = "smarty/"; //smarty's config info
$smarty->caching = false; //use cache or not
$smarty->template_dir = "./templates"; //set the folder for keeping the templates
/**
* smarty can automatically compile the templates and php contents to an mixed file
* and be stored in templates_C folder
*/
$smarty->compile_dir = "./templates_c"; //the folder that store compiled files
$smarty->cache_dir = "./smarty_cache"; //store cache files
$smarty->left_delimiter = "{";
$smarty->right_delimiter = "}";
?>
According to the code we should also create 3 folders which are used to store some corresponding files. templates folder is used to store html files which as the folder's name shows: they are templates, and will be called by "$smarty->display()" to show different styles for a project. tempates_c is used to store the compiled files. php files and templates are written in different files, but the php compiler can compile the templates and php contents to an mixed file and store them into templates_c folder. smarty_cache is used to store cache files.
Step3: write the php content ( a.php)
<?php
/*
* Created on Jan 10, 2013
* Author: Nick
* Function:
*/
include("SmartyCon.php");
$name = "php100";
//$smarty->assign("title",$name); //assign php variabel to the tab in templates
//$smarty->display("a.html"); //show the template
$nameTwo[] = array("name"=>"jimmy","city"=>"Montreal");
$nameTwo[] = array("name"=>"tim","city"=>"wuxi");
$nameTwo[] = array("name"=>"sam","city"=>"newyork");
$nameTwo[] = array("name"=>"john","city"=>"sanfran");
$nameTwo[] = array("name"=>"lily","city"=>"loyola");
$title= array("a"=>"name","b"=>"News","c"=>"date","d"=>"now()");
$smarty->assign("title",$nameTwo); //assign php variabel to the tab in templates
$smarty->assign("ab",$title);
$smarty->display("a.html"); //show the template
?>
Step 4: write template file( a.html)
<html>
<h1>{$ab["b"]}</h1>
<hr>
<b>{$title}</b>
{section name=list loop=$title}
<b>
{$title[list].name} - {$title[list].city}
</b><br>
{/section}
</html>
The result is like this:
As to how to print out the values in a two dimentional table, we have to use {section name='' loop=$..}{/section}