函数与作用域
2017-12-19 本文已影响0人
Tuuu
函数声明和函数表达式有什么区别
- 函数声明：使用
function关键字可以声明一个函数，声明不必放到调用的前面，function后必须添加函数名称;
// 函数声明
function sayHello(){
console.log('hello')
}
//函数调用
sayHello();
- 函数表达式：使用
var关键字以表达式的方式来声明一个函数，声明必须放到调用的前面，function后可以不添加函数名称；
// 函数表达式
var sayHello = function(){
console.log('hello');
}
// 函数调用
sayHello()
什么是变量的声明前置？什么是函数的声明前置
- 变量的声明前置：浏览器在执行代码之前，会把所有变量的的声明提升到作用域顶部；
- 函数的声明前置：1. 如果使用函数表达式声明函数，那么规则和变量的声明前置一样；2. 如果使用函数声明的方式，也是同样的规则，前提是函数声明的部分已经下载到本地。
arguments 是什么
- 由于 JavaScript 允许函数有不定数目的参数，所以需要一种机制，可以在函数体内部读取所有参数。
arguments对象包含了函数运行时的所有参数，arguments[0]就是第一个参数，arguments[1]就是第二个参数，以此类推。这个对象只有在函数体内部，才可以使用。
function printInfo(name, age, sex){
console.log(name);
console.log(age);
console.log(sex);
console.log(arguments);
console.log(arguments[0]);
}
函数的"重载"怎样实现
- 可以在函数体中针对不同的参数调用执行相应的逻辑（类似重载的效果）
function printInfo(name, age, sex){
if(name){
console.log(name);
}
if(age){
console.log(age);
}
if(sex){
console.log(sex);
}
}
printInfo('Tuuu', 20);
printInfo('Tuuu', 20, 'male');
立即执行函数表达式是什么？有什么作用
!function (){
var a;
a = 1;
console.log(1);
}()
// ! 可以更换为 +/-/~/() 来使用，其中 () 后面必须加分号。
目的有两个：一是不必为函数命名，避免了污染全局变量；二是为了得到一个独立的作用域，可以封装一些外部无法读取的私有变量。
求n!，用递归来实现
代码如下
function xxx(num) {
if (num < 2) {
return 1;
}
else{
return (num*(xxx(num - 1)));
}
}
以下代码输出什么？
function getInfo(name, age, sex){
console.log('name:',name);
console.log('age:', age);
console.log('sex:', sex);
console.log(arguments);
arguments[0] = 'valley';
console.log('name', name);
}
getInfo('饥人谷', 2, '男');
name: 饥人谷
age: 2
sex: 男
Arguments(3) ["饥人谷", 2, "男"]
name valley
getInfo('小谷', 3);
name: 小谷
age: 3
sex: undefined
Arguments(2) ["小谷", 3]
name valley
getInfo('男');
name: 男
age: undefined
sex: undefined
Arguments(1) ["男"]
name valley
写一个函数，返回参数的平方和？
function sumOfSquares(){
}
var result = sumOfSquares(2,3,4)
var result2 = sumOfSquares(1,3)
console.log(result) //29
console.log(result2) //10
function sumOfSquares(){
var sum = 0;
for (var i = 0; i < arguments.length; i++) {
sum = sum + arguments[i] * arguments[i];
}
return sum;
}
如下代码的输出？为什么
console.log(a);
var a = 1;
console.log(b);
输出结果：
undefined, 变量提升将 var a 被提升到作用域最上方，输出 a 时 a 还没有被赋值
报错，b is not defined, 因为b 没有被声明
如下代码的输出？为什么
sayName('world');
sayAge(10);
function sayName(name){
console.log('hello ', name);
}
var sayAge = function(age){
console.log(age);
};
变量声明前置后
var sayAge
function sayName(name){
console.log('hello ', name);
}
sayName('world'); // hello, world
sayAge(10); // 报错 sayAge is not a function
sayAge = function(age){
console.log(age);
}
如下代码输出什么? 写出作用域链查找过程伪代码
var x = 10
bar()
function foo() {
console.log(x)
}
function bar(){
var x = 30
foo()
}
globalContext = {
AO: {
x = 10;
foo: function;
bar: function;
}
}
foo.[[scope]] = globalContext.AO
bar.[[scope]] = globalContext.AO
fooContext = {
AO:{}
scope: foo[[.scope]]
}
barContext = {
AO: {
x = 30;
foo: function
}
scope: bar[[.scope]]
}
console.log(x) // 10
如下代码输出什么? 写出作用域链查找过程伪代码
var x = 10;
bar()
function bar(){
var x = 30;
function foo(){
console.log(x)
}
foo();
}
globalContext = {
AO: {
x = 10;
bar: function;
}
}
bar.[[scope]] = globalContext.AO
barContext = {
AO: {
x = 30;
foo: function
}
scope: bar[[.scope]]
}
foo[[.scope]]
fooContext = {
AO:{}
scope: foo[[.scope]]
}
console.log(x) // 30
以下代码输出什么? 写出作用域链的查找过程伪代码
var x = 10;
bar()
function bar(){
var x = 30;
(function (){
console.log(x)
})()
}
globalContext = {
AO: {
x = 10;
bar: function;
}
}
bar.[[scope]] = globalContext.AO
barContext = {
AO: {
x = 30;
function: function
}
scope: bar[[.scope]]
}
function[[.scope]]
functionContext = {
AO:{}
scope: function[[.scope]]
}
console.log(x) // 30
以下代码输出什么？ 写出作用域链查找过程伪代码
var a = 1;
function fn(){
console.log(a)
var a = 5
console.log(a)
a++
var a
fn3()
fn2()
console.log(a)
function fn2(){
console.log(a)
a = 20
}
}
function fn3(){
console.log(a)
a = 200
}
fn()
console.log(a)
globalContext {
AO: {
a = 1;
fn: function
fn3: function
}
}
fn[[.scope]] = globalContext.AO
fn3[[.scope]] = globalContext.AO
fnContext {
AO: {
a = undefined
f3 = function
f2 = function
}
scope: fn[[.scope]]
}
fn2[[.scope]] = fnContext.AO
fn2Context {
AO: {}
scope: fn2[[.scope]]
}
fn3Context {
AO: {}
scope: fn3[[.scope]]
}
// 输出结果： undefined 5 1 6 20 200
