前端基本功—js第二天

1.函数

1.1函数声明

js中可以通过以下三种方法定义函数:

  • 自定义函数
  • 直接量声明(函数表达式声明)
  • 使用Function函数构造法(参数必须加引号)。
    区别:自定义函数和直接量声明是有区别的,自定义函数调用函数在定义之前之后都是可以了;而直接量声明只能在声明函数之后调用,否则会报错(像我下面的fun2就会报错)。
//1.自定义函数
function fun1(){
alert("我是自定义函数");
}
//函数声明之后需要调用,不然不会自动执行,执行函数可以在声明之前也可以在声明之后
//fun1();
//2.直接量声明
//fun2()   //调用函数
var fun2 = function(){
alert("我是直接量声明");
}
//3.使用Function关键字
var fun3 = new Function("var a=10,b=20;alert(a+b);");
fun3()

1.2变量提升

变量提升指的是在函数体内会把变量的声明提升到函数体的最前面,只声明但是并不给变量赋值。
例如

function fun(){
    console.log(num);
    var num = 20;
}
相当于
function fun(){
  var num;
  console.log(num);
  num = 20;
}
所以结果可想而知,在这里会报undefined的异常。

下面的输出结果是undefined和20,就是执行了变量提升,尽管前面声明了num,但是在函数里面先声明num,而且没有给赋值。

var num=10;
function fun1(){
    alert(num);
    var num = 20;
    alert(num);
}
fun1();  //调用函数

1.3函数参数

js在创建函数的同时会创建一个arguments对象用来存储函数调用时传过来的实参,arguments对象的长度由传入实参的个数决定。函数名.length可以获取函数形参的个数。根据这一方法可以判断实参和形参个数是否相同。函数实参个数多于形参个数可以调用,小于则会报错(相当于一个形参undefined)

function fun(a,b){
    console.log(a+b);
}
fun(1,2);   //3
fun(5);    //NaN
fun(4,5,6);  //9

下面判断形参和实参个数

function fun(a,b){
    if(fun.length == arguments.length){
    console.log(a+b);
}else{
    console.error("传递参数不匹配")
}
}
fun(1,2);   //3
fun(1,2,3); //传递参数不匹配

1.4两种定义变量的区别

var a=1,b=1和var a=b=1。
前者相当于var a=1;var b=1;两个变量均是局部变量。而后一个a是局部变量,b则是全局变量(隐式的全局变量)
var a=1和a=1
前者如果是在函数内声明属于局部变量,如果在函数外声明属于全局变量。后者跟上面说的一样,属于隐式的全局变量。

2.return

return有两个作用:一是设置返回值,另一个是终止代码的执行。
在函数内部使用return来设置返回值,一个函数只能有一个返回值,自定义的函数默认没有返回值。同时return后跟逗号可以终止代码的执行(比如提交表单之前的校验)。

function fun(a,b){
  if(a>b){
  //return 不仅返回函数运行的结果,如果直接用return后跟分号,是终止当前函数的执行。
  return;
  }
return a+b;
}
console.log(fun(2,1));

3.++运算

i++:先使用i,执行完再运算i=i+1;
++i:先运算i=i+1,然后在执行运算。

var a=10, b=20 , c=30;
++a;
a++;
e=++a+(++b)+(c++)+a++;
alert(e);
弹出结果是:77

4.this

this自己的,主要指事件的调用者。
innerHTML更换盒子的内容
value获取和设置表单的值
下面说一个小技巧,页面加载完毕之后自动获取焦点(例如百度搜索),鼠标滑过之后自动选中文本内容,便于用户删除搜索框的内容dom.focus()获取dom焦点,onfocus()获取焦点触发事件,dom.select()选中dom。


    
    09两个表单小方法
    



4.1输入框表单校验(基本的表单校验)

    




4.2金字塔

在页面输出一个金字塔的形状,可以使用for循环,使用百分比来控制hr的宽度。




代码地址:https://git.oschina.net/catchu/web-study

你可能感兴趣的:(前端基本功—js第二天)