函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。
好处:在出现大量程序相同的时候,可以封装为一个function,这样只用调用一次,就能执行很多语句。
(1)语法:
函数就是包裹在花括号中的代码块,前面使用了关键词 function:
eg:
function myFunction(){
  //执行的代码
}
//调用。
myFunction();
<button onclick="myFunction()">点击</button>
(2)参数
function小括号中的参数,叫形式参数(形参);调用时传的数值,叫做实际参数(实参)。
变量和参数必须以一致的顺序出现。
eg:
function myFunction(a,b){
  console.log(a+b);
}
myFunction(1,2);
//3
(3)返回值return
函数只能有唯一的return,有if语句除外。
使用 return 语句时,函数会停止执行,并返回指定的值。
function myFunction(){
  var x=5;
  return x;
  x=7;
}
myFunction()
//5
var myVar=myFunction();
myVar 值是 5,也就是函数 "myFunction()" 所返回的值。
希望退出函数时 ,使用 return 语句。
var x=10;
function myFunction(a,b){
  if (a>b){
    return;
  }
  x=a+b
  return x;
}
myFunction(2,1);
//undefined
myFunction(2,3);
//5
(4)函数表达式
定义函数,还有一种方法,就是函数表达式。
eg:
function myFunction(){
}
var myFunctionval = function(){
}
函数没有名字,叫匿名函数
var myFunctionval = function(a,b){
  return a + b;
}
调用函数,直接使用myFunctionval变量来调用。
console.log(myFunctionval(1,3));
//4
(5)局部变量和全局变量
在函数内部声明的变量(使用 var)是局部变量,只能在函数内部访问它。(该变量的作用域是局部的)。
您可以在不同的函数中使用名称相同的局部变量。
eg:
function myFunction(){
  var a = 1; //局部变量
  console.log("a值" + a);
}
myFunction();
console.log("a值" + a);
//a值1
//a is not defined; 函数外面无法访问函数内部定义的a
在函数外声明的变量是全局变量,网页上的所有脚本和函数都能访问它。
把值赋给尚未声明的变量,该变量将被自动作为全局变量声明。
eg:
var a = 1; //全局变量
function myFunction(){
  console.log("a值" + a);
}
myFunction();
console.log("a值" + a);
//a值1
//a值1
注意:
变量的生命期从它们被声明的时间开始。
局部变量会在函数运行以后被删除。
全局变量会在页面关闭后被删除。
(6)作用域链
子对象会一级一级地向上寻找所有父对象的变量。所以,父对象的所有变量,对子对象都是可见的,反之则不成立。
var a = 1;
function fn(){
  var a = 5; //同名,遮蔽效果
  console.log(a);
}
fn(); //5
console.log(a); //1

eg:
var a = 1;
var b = 2;
function outer(){
  var a = 3;
  function inner(){
    var b = 4;
    console.log(a); //找上一层找到3
    console.log(b); //局部4
  }
  inner();
  console.log(a); //本层函数内 3
  console.log(b); //本层无,找到外部全局的2
}
outer();
console.log(a); //只能找全局的 1
console.log(b); //只能找全局的 2
//3
//4
//3
//2
//1
//2
(7)函数声明的提升
JS在执行前,会有一个预解析的过程,把所有的函数声明,都提升到了最最开头,然后再执行第一行语句。
函数声明会被提升,但是函数表达式却不会被提升
eg:
myFunction();
var myFunctionval = function(){
  console.log("1");
}
//myFunction is not defined(…)
myFunction();
function myFunction(){
  console.log("1");
}
//1。
注意
foo这个标识符冲突了,一个函数叫做foo,一个变量也叫作foo。预解析阶段,如果遇见标识符冲突,函数优先。
foo();
var foo;
function foo(){
console.log("1");
}
foo = function(){
console.log("2");
}
//1
eg:
var myFunction = 1;
function myFunction(){
alert("我是函数");
}
myFunction();
//myFunction is not a function(…)
预解析的时候 myFunction是个函数。当执行到 var myFunction=1;的时候时。 myFunction=1; myFunction()的时候。会报错
eg:
myFunction();
var myFunction = 1;
var myFunction= function(){
alert("我是函数");
}
// myFunction is not a function(…);
函数声明提升的时候,函数表达式不会被提升。预解析的时候myFunction是1. myFunction()的时候。会报错
(8)函数是一个引用类型 typeof(function)
基本类型:number、string、boolean、undefined、null
引用类型:object、function、array、RegExp、Math、Date。
基本类型保存值,引用类型保存地址
var a = 1;
var b = a;
b = 3; //更改了b的值,a不受影响
console.log(a);
//1
eg:
var a = function(){
  alert("我是一个函数");
}
var b = a; //把匿名函数的地址也给了b
b.abc = 1;
//输出a的haha属性,你会发现a也有这个属性也改变了 //b的abc属性和a的同步变化,都是指向的同一个对象
console.log(a.abc);
// 1

构造函数:
new是是一个操作符,使用new操作符调用函数的时候,此时将会发生4个事情:
(1)创建一个空对象
(2)把函数内部的this指向这个空对象
(3)将顺序函数执行里面的语句
(4)返回这个对象
function fun(){
name : "小花" ,
age : 18 ,
sex : "女",
}
var xiaoming = new fun();
console.log(xiaoming);
//fun {name: "小花", age: 18, sex: "女"}
javascript基础之对象
对象只是带有属性和方法的特殊数据类型
javaScript 有内置对象比如 String、Date、Array 等等。
1:用字面量的方式创建,使用{}当做界定符号,里面用k-v对儿罗列所有属性
var obj = {
name : "小花" ,
age : 18 ,
sex : "女",
sayHello : function(){
console.log("我是" + this.name);
}
}
对象就是属性的无序集合
2:访问对象的属性
objectName.propertyName
objectName["propertyName"]
访问对象的方法
objectName.methodName()
var obj = {
name : "小花" ,
age : 18 ,
sex : "女",
sayHello : function(){
console.log("我是" + this.name);
}
}
console.log(obj.name);
console.log(obj['name']);
console.log(obj.sayHello);
console.log(obj['sayHello']);
console.log(obj.sayHello());
//小花
//小花
//函数
//函数
//我是小花
3:对象的字面量和JSON的关系
JSON没有声明变量这一说(JSON中没有变量的概念)
JSON末尾没有分号{}后面
JSON要求所有的键必须有双引号(单引号不行),而对象字面量不要求(当键的名字不符合标识符名字的时候必须加上双引号,英语字母、数字、_、$ ,不以数字开头)。
4:this指向问题
关键字
指向的是调用函数的那个对象
和调用有关和定义无关
(1)当用()调用的时候,指向的是window
function myfunction(){
console.log(this);
}
myfunction();
//Window {external: Object, chrome: Object, document: document, _ASYNC_START: 1500782356654, _chrome_37_fix: undefined…}
(2)dom元素事件处理程序的时候,指向的是dom对象
function myfunction(){
console.log(this);
}
div.onclick=myfunction;
//div
(3)当函数被setInterval、setTimeout调用的时候,函数里面的this是window对象
setInterval(myfunction,2000);
(4)当函数被当做某个对象属性被调用的时候,此时这个函数里面的this指的是这个对象
var obj = {
name : "小花" ,
age : 18 ,
sex : "女",
sayHello : function(){
console.log("我是" + this.name);
}
}
obj.sayHello();
(5)call和apply方法可以任意设置函数里面的this
函数.call(对象);
函数.apply(对象);
函数立即执行,且函数内部的this指向对象。
区别是传参:
sum.call(obj,1,2,3); // call必须要用逗号罗列所有参数
sum.apply(obj , [1,2,3]); // apply用数组罗列所有参数
(6)new 调用的函数。
this指的是系统内部创建的新对象

javascript函数,构造函数。js对象和json的区别。js中this指向问题的更多相关文章

  1. js对象和json的区别

    他们两个没有什么关联只不过可以相互转换而已,就像json可以转化为java对象一样 注意:json只有字符串形式(就是我们常说的json字符串:key/value值和数组形式的字符串),没有什么jso ...

  2. 【JS对象、JSON字符串】之间的相互转换

    在Firefox,chrome,opera,safari,ie9,ie8等浏览器直接可以用JSON对象的stringify()和parse()方法. 1.JSON.stringify(obj)将JS对 ...

  3. JSON(二)——JavaScript中js对象与JSON格式字符串的相互转换

    首先我们来看一下js中JSON格式的字符串 var JSONStr1 = "{\"name\" : \"张三\"}"; 注意以下的写法不是j ...

  4. JS对象与json字符串格式

    <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8&quo ...

  5. json转js对象方法,JS对象转JSON方法

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  6. ajax-json,遇到的一个问题,jquery var ,加载顺序。JS对象,json格式转换。

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. JSON转JS对象,JS对象转JSON

    一.从服务端发来的json字符串,怎么才能作为JavaScript对象(JSON对象)在web端调用呢? 1.如果使用jQuery,就很方便了,可以在ajax一系列函数中,把参数Datatype传js ...

  8. JavaScript 函数,math对象,Date对象 序列化 总结

    函数 函数定义 // 普通函数定义 function f1() { console.log("Hello world!"); } // 带参数的函数 function f2(a, ...

  9. json,json对象以及js对象字面量的区别

    从定义看: json:一种数据交换格式 json对象:js的一个内置对象,拥有JSON.stringify()和JSON.parse()两个方法 js对象字面量:封闭在花括号对({})中的一个对象的零 ...

随机推荐

  1. GIT 使用 osc 在线托管

    今天一看,osc的代码托管自己开了2年了,csdn的代码托管也开了3年了,只是项目里有几个了了就是fork来的,自己的也没认真写,之前工作也用git,现在改用自己的git了. 所以就把Key-gen ...

  2. 10款最新CSS3/jQuery菜单导航插件

    这是我们在2014年收集的10款最新的CSS3 / jQuery菜单导航插件,不论从外观样式,还是功能扩展性,这些jQuery菜单一定可以满足大家的设计需求.这次我们收集的jQuery菜单,有水平 菜 ...

  3. kuangbin带你飞 后缀数组 题解

    2份模板 DC3 . 空间复杂度O3N 时间复杂度On #define F(x) ((x) / 3 + ((x) % 3 == 1 ? 0 : tb)) #define G(x) ((x) < ...

  4. python中的with与上下文管理器

    #转载请留言联系 很多人平时需要打开文件进行读取写入操作时,通常这样: f = open('文件路径','w') f.write(data) f.close 这样写有一个潜在的问题,如果在调用 wri ...

  5. ORM- 图书系统查询

    图书信息系统 表结构设计 # 书 class Book(models.Model): title = models.CharField(max_length=32) publish_date = mo ...

  6. [BZOJ2667][cqoi2012]模拟工厂 贪心

    2667: [cqoi2012]模拟工厂 Time Limit: 3 Sec  Memory Limit: 128 MBSubmit: 367  Solved: 184[Submit][Status] ...

  7. 新电脑配置 git 同步github账户

    1.下载安装git 2.初始化 仓库文件夹 git init 3.生成公钥ssh-keygen -t rsa -C "youremail@example.com"4.github ...

  8. [libgdx游戏开发教程]使用Libgdx进行游戏开发(8)-粒子系统

    没有美工的程序员,能够依赖的还有粒子系统. 这一章我们将使用libGDX的粒子系统线性插值以及其他的方法来增加一些特效. 你也可以使用自己编辑的粒子效果,比如这个粒子文件dust:http://fil ...

  9. python2和python3中的编码问题

    开始拾起python,准备使用python3, 造轮子的过程中遇到了编码的问题,又看了一下python3和python2相比变化的部分. 首先说个概念: unicode:在本文中表示用4byte表示的 ...

  10. EasyUI中combobox的代码实例

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...