函數聲明和函數表達式有什么區別
函數聲明使用 function fn(){}
直接寫 ,在函數前后都可以調用該函數
fn(); // jirengu
function fn(){
console.log('jirengu');
}
fn(); // jirengu
函數表達式使用 var fn = function(){}
聲明,調用函數必須先聲明,再調用
fn(); // 報錯 fn is not a function
var fn = function(){
console.log('jscode')
}
fn(); // jscode
什么是變量的聲明前置?什么是函數的聲明前置
在同一個作用域下,聲明前置是把該聲明的變量和函數提升到自身所在作用域的最頂部。
console.log(str);
var str = 'jirengu';
console.log(str);
fn();
function fn(){
console.log('jirengu');
}
js解析順序
var str;
function fn(){
}
console.log(str); // undefined
var str = 'jirengu';
console.log(str); // jirengu
fn();
console.log('jirengu');
arguments 是什么
arguments
是一個類數組對象,它包含了函數的所有傳入參數,可以用數組下標來獲取值,不建議使用,因為可讀性很差
function fn(name, age, sex){
console.log(name); // 柏龍
console.log(age); // 30
console.log(sex); // 男
console.log(arguments); // 獲取的是 ['柏龍', 30, '男']
console.log(arguments[0]); // 柏龍
}
fn('柏龍', 30, '男');
函數的"重載"怎樣實現
在JS中沒有重載,同名函數會覆蓋
但可以在函數體針對不同的參數調用來執行相應的邏輯
function fn(name, age, sex){
if(name){
console.log(name);
}
if(age){
console.log(age);
}
if(sex){
console.log(sex);
}
}
fn('柏龍', 30);
fn('柏龍', 30, '男');
立即執行函數表達式是什么?有什么作用
(function(){ var str = 'jirengu'; })();
作用 隔離作用域,讓函數里面的變量被保護起來,外部無法訪問
求n!,用遞歸來實現
function fn(n){
if(n === 1){
return 1;
}
return n * fn(n-1);
}
fn(6); // 720 => 6 * 5 * 4 * 3 * 2 * 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, '男');
getInfo('小谷', 3);
getInfo('男');
getInfo('饑人谷', 2, '男');
'name': 饑人谷
'age': 2
'sex': 男
['饑人谷', 2, '男']
'name' valley
getInfo('小谷', 3);
'name': 小谷
'age': 3
'sex': undefined
['小谷', 3]
'name' valley
getInfo('男');
'name': 男
'age': undefined
'sex': undefined
['男']
'name' valley
寫一個函數,返回參數的平方和?
function sumOfSquares(){
}
var result = sumOfSquares(2,3,4)
var result2 = sumOfSquares(1,3)
console.log(result) //29
console.log(result) //10
代碼:
function sumOfSquares(){
var result = 0;
for (var i = 0; i < arguments.length; i++) {
result += arguments[i] * arguments[i]
}
return result;
}
如下代碼的輸出?為什么
console.log(a);
var a = 1;
console.log(b);
依次輸出:
undefined
Uncaught ReferenceError: b is not defined
因為聲明的變量會提升到自身所在作用域的最頂部。
console.log(a); // 先聲明,在第一行輸出是沒有賦值,輸出undefined
console.log(b); // 沒有聲明 所以會報錯
如下代碼的輸出?為什么
sayName('world');
sayAge(10);
function sayName(name){
console.log('hello ', name);
}
var sayAge = function(age){
console.log(age);
};
依次輸出:
undefined
Uncaught TypeError: sayAge is not a function
因為 function
聲明函數無論寫在函數體前面或后面都可以調用,函數表達式在調用時必須先聲明,再調用
如下代碼輸出什么? 寫出作用域鏈查找過程偽代碼
var x = 10
bar()
function foo() {
console.log(x)
}
function bar(){
var x = 30
foo()
}
代碼輸出: 10
globalContent = {
AO: {
x: 10,
foo: function,
bar: function
},
scope: null
}
foo.[[scope]] = globalContent.AO;
bar.[[scope]] = globalContent.AO;
barContent = {
AO: {
x: 30
},
scope : globalContent.AO;
}
fooContent = {
AO: {
},
scope : globalContent.AO;
}
如下代碼輸出什么? 寫出作用域鏈查找過程偽代碼
var x = 10;
bar()
function bar(){
var x = 30;
function foo(){
console.log(x)
}
foo();
}
代碼輸出:30
globalContent = {
AO: {
x: 10,
bar: function
},
scope: null
}
bar.[[scope]] = globalContent.AO;
barContent = {
AO: {
x: 30,
foo: function
},
scope : globalContent.AO;
}
foo.[[scope]] = barContent.AO;
fooContent = {
AO: {
},
scope : barContent.AO;
}
以下代碼輸出什么? 寫出作用域鏈的查找過程偽代碼
var x = 10;
bar()
function bar(){
var x = 30;
(function (){
console.log(x)
})()
}
代碼輸出:30
globalContent = {
AO: {
x: 10,
bar: function
},
scope: null
}
bar.[[scope]] = globalContent.AO;
barContent = {
AO: {
x: 30,
fn : function
},
scope : globalContent.AO;
}
foo.[[scope]] = barContent.AO;
fnContent = {
AO: {
},
scope : barContent.AO;
}
以下代碼輸出什么? 寫出作用域鏈查找過程偽代碼
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)
代碼輸出:
undefined
5
1
6
20
200
globalContent = {
AO: {
a: 1, // fn3 調用fnContent.AO a=200
fn: function,
fn3: function
},
scope: null
}
fn.[[scope]] = globalContent.AO;
fn3.[[scope]] = globalContent.AO;
fnContent = {
AO: {
a: undefined, // 第二次打印為 5
fn3: function, // 第三次打印 1
fn2: function, // 第4次打印 6
}
scope: globalContent.AO;
}
fn3Content = {
AO: {
},
scope: globalContent.AO;
}
fn2Content = {
AO: {
a: 20 // 第5次打印 調用fnContent.AO a=20
}
scope: fnContent.AO;
}