你不知道的javaScript笔记(1)
时间:2022-04-23
本文章向大家介绍你不知道的javaScript笔记(1),主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
规避冲突
function foo(){
function bar(a){
i = 3;
console.log(a + i);
}
for ( var i=0; i < 10; i++){
bar(i * 2)
}
}
// 11无限死循环
区分函数声明和函数表达式最简单的方法是看 function 关键字出现的位置,如果function是声明中的第一个词,那么是函数声明,否则是函数表达式。
(function foo(){})() 立即执行的函数表达式
IIFE 立即执行函数表达式
var a = 2;
(function IIFE(global){
var a = 3;
console.log(a); // 3
console.log(global.a) // 2
})(window)
console.log( a) // 2
将window 对象的引用传递进去,当然可以从外部作用域传入进任何你需要的东西,
并可以将变量命名为任何你觉得合适名字。
var a = 2;
(function IIFE(def) {
def(window)
})(function def(global) {
var a = 3;
console.log(a); // 3
console.log(global.a) //2
});
函数表达式def 定义在片段的第二部分,然后当做参数被传递进IIFE 函数定义的第一部分中。最后def也就是传递进去的函数被调用,并将window 传入当做global参数的值。
try/catch 的catch 分句会创建一个块级 作用域,其中声明的变量仅在catch内部有效
例如:try{
undefinde();
}catch (err){
console,log(err); // 能够正常使用
}
console.log(err) // ReferenceError: err not found
let 块作用域
var foo = true;
if(foo){
let bar = foo *2;
bar = something(bar);
console.log(bar);
}
console.log(bar); // ReferenceError
变量提升,先有声明后又赋值。
foo();
function foo(){
console.log(a); // undefinded
var a = 2;
}
原因:相当于以下
function foo(){
var a;
console.log(a); // undefined
a = 2;
}
foo();
注意: 函数声明会被提升,函数表达式不会被声明。函数和变量都会被提升,但是函数会被提前提升,然后是变量。
foo(); //1
var foo;
function foo(){
console.log(1);
}
foo = function() {
console.log(2)
}
const 常量
后面的函数声明会覆盖前面的
foo(); // 3
function foo(){
console.log(1);
}
var foo = function() {
console.log(2);
}
function foo(){
console.log(3);
}
var a = 2 ; 的解析原则是 var a 和 a = 2 当做两个单独的声明,第一个是编译阶段的
任务,第二个是执行阶段的任务。
闭包
function foo() {
var a = 2;
function bar(){
console.log(a);
}
return bar;
}
var baz = foo();
baz(); // 2
var fn;
function foo() {
var a = 2;
function baz() {
console.log(a)
}
bar(baz);
}
function bar(fn){
fn();
}
for(var i = 1; i<=5; i++){
(function(j){
setTimeout(function(){
console.log(j)
},j*1000)
})(i)
}
在迭代器内部使用IIFE会为每一个迭代都生成一个新的作用域。
块作用域和闭包联手
for(var i = 1; i <= 5; i++){
setTimeout(function timer(){
console.log(i)
},i*1000)
}
模块
function CoolModule(){
var something = "cool";
var another = [1,2,3];
function doSomething() {
console.log(something);
}
function doAnoth(){
console.log(another.join("!"));
}
return {
doSomething: doSomething,
doAnother: doAnother
};
}
var foo = CoolModule();
foo.doSomething(); //cool
foo.doAnother() // 1!2!3
改为单例模式:
var foo = (function CoolModule(){
var something = "cool";
var another = [1,2,3];
function doSomething() {
console.log(something)
}
function doAnother(){
console.log(another.join("!"))
}
return {
doSomething: doSomething,
doAnother: doAnother
}
})();
foo.doSomething(); // cool
foo.doAnother(); //1!2!3
- MYSQL常用SQL汇总
- Linux 下设置SVN DIFF
- 剑指 offer代码解析——面试题38数字在排序数组中出现的次数
- 剑指 offer代码解析——面试题37两个链表的第一个公共结点
- 剑指 offer代码解析——面试题34丑数
- 剑指 offer代码解析——面试题35第一个只出现一次的字符
- Python内置数据结构之集合
- 剑指 offer代码解析——面试题32统计1到n中1出现的次数
- 剑指 offer代码解析——面试题26复杂链表的复制
- Linux软件安装(二)——RPM与YUM
- linux软件安装(一)——源码安装
- 利用LUA协程实现FUTURE模式
- Python内置数据结构之字典(完整版)
- Maven使用详解
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- [Oracle集群软件全解析]Oracle Cluster Registry Utility 参考
- mysqldump命令详解 Part 8 其他的一些的参数的介绍
- mysqldump命令详解 Part 6- --master-data参数的使用
- 腾讯云语音识别.net-sdk使用笔记0818
- mysqldump命令详解 Part 9 mysqldump命令总结
- [MySQL学习笔记] 3.mysqldump命令详解 Part 2 -备份全库
- [MySQL学习笔记]1. MySQL测试数据的构造
- [MySQL学习笔记]2. mysqldump命令详解 Part 1
- 怎样在PF_ring上使用RSS实现网络流量负载均衡
- Docker镜像原理 aufs overlay overlay2
- Zabbix 5.0 LTS 安装
- 技术博客测试: Elasticsearch
- Oracle基本参数(COMPATIBLE)
- Oracle基本参数(CONTROL_FILES)
- Oracle基本参数(DB_BLOCK_SIZE)