函数\箭头函数参数解析笔记

news/2024/7/10 23:34:57 标签: javascript, jquery

使用nodejs编译js文件

使用cd 命令进入存放需要编译js的文件
node 文件名.js

知识：

1、javascript本质上是什么？就是一门编程语言，解释执行的

2、浏览器的内核包括两部分核心：1、DOM渲染引擎；2、js解析器（js引擎）

3、js运行在浏览器中的内核中的js引擎内部

4、是否js只能运行在浏览器中？不是的

5、实现动态网站的技术：java php .net python nodejs…

6、基于Node.js和第三方工具electron可以开发桌面应用程序

7、REPL read-eval-print-loop 读取代码-执行-打印结果-循环这个过程

8、在REPL环境中，_表示最后一次执行结果; .exit 可以退出REPL环境

Node.js 是一种建立在Google Chrome’s v8 engine上的 non-blocking (非阻塞）, event-driven （基于事件的） I/O平台.
Node.js平台使用的开发语言是JavaScript，平台提供了操作系统低层的API，方便做服务器端编程，具体包括文件操作、进程操作、通信操作等系统模块

终端基本使用

打开应用

  • notepad 打开记事本
  • mspaint 打开画图
  • calc 打开计算机
  • write 写字板
  • sysdm.cpl 打开环境变量设置窗口

常用命令

  • md 创建目录
  • rmdir(rd) 删除目录，目录内没有文档。
  • echo on a.txt 创建空文件
  • del 删除文件
  • rm 文件名 删除文件
  • cat 文件名 查看文件内容
  • cat > 文件名 向文件中写上内容。

nvm常用的命令

  • nvm list 查看当前安装的Node.js所有版本
  • nvm install 版本号 安装指定版本的Node.js
  • nvm uninstall 版本号 卸载指定版本的Node.js
  • nvm use 版本号 选择指定版本的Node.js

ES6常用语法

  • 变量声明let与const
  • 变量的解构赋值
    • 数组解构赋值
    • 对象解构赋值
    • 字符串解构赋值
  • 字符串扩展
    • includes()
    • startsWith()
    • endsWith()
    • 模板字符串
  • 函数扩展
    • 参数默认值
    • 参数结构赋值
    • rest参数
    • 扩展运算符
    • 箭头函数
  • 类与继承

声明变量let和const

  • let 声明变量不可以先引用后声明 var 声明变量可以先引用后声明

let声明的变量不存在预解析
console.log(flag);
var flag = 123;
let flag = 456;

  • let声明的变量不允许重复（在同一个作用域内）

let flag = 123;
let flag = 456;
console.log(flag);

  • const用来声明常量

const声明的常量不允许重新赋值
const n = 1;
//n = 2;
const声明的常量必须初始化

变量赋值

  1. 变量的解构赋值

var a = 1;
var b = 2;
var c = 3;
console.log(a,b,c);
输出：(1,2,3)

  • 数组的解构赋值

var a = 1,b = 2,c = 3;
console.log(a,b,c);
输出：(1,2,3)

let [a,b,c] = [1,2,3];
console.log(a,b,c);
输出：(1,2,3)

let [a,b,c] = [,123,];
console.log(a,b,c);
输出：(underfind,123,underfind)

let [a=111,b,c] = [,123,];
console.log(a,b,c);
输出：(111,123,underfind)

对象的解构赋值

  • 输出都是一样，不影响

let {foo,bar} = {foo : ‘hello’,bar : ‘hi’};
let {foo,bar} = {bar : ‘hi’,foo : ‘hello’};

  • 对象属性别名(如果有了别名，那么原来的名字就无效了)

let {foo:abc,bar} = {bar : ‘hi’,foo : ‘nihao’};
console.log(foo,bar);

  • 对象的解构赋值指定默认值

let {foo:abc=‘hello’,bar} = {bar : ‘hi’};
console.log(abc,bar);
输出：(hello,hi)

  • 都是function对象

let {cos,sin,random} = Math;
console.log(typeof cos);
console.log(typeof sin);
console.log(typeof random);

  • 字符串的解构赋值
    1.解析1

let [a,b,c,d,e] = “hello”;
console.log(a,b,c);
输出：(h,e,l,l,0)

1.解析2

let [a,b,c,d,e,length] = “hello”;
console.log(a,b,c,d,e); //h,e,l,l,0
console.log(length); //undefind
// console.log(length); 通过这样方法不准确得到字符串的长度

console.log(“hello”.length); //5

let {length} = “hi”;
console.log(length); //2

字符串

  • 字符串相关扩展

includes() 判断字符串中是否包含指定的字串（有的话返回true，否则返回false）
console.log(‘hello world’.includes(‘world’));

  • includes(参数1,位置); 参数一：匹配的字串；参数二：从第几个开始匹配

console.log(‘hello world’.includes(‘world’,7));

  • 判断字符串是否以特定的字串开始

startsWith() 判断字符串是否以特定的字串开始
console.log(url.startsWith(‘aadmin’));

  • 判断字符串是否以特定的字串结束

endsWith() 判断字符串是否以特定的字串结束
console.log(url.endsWith(‘phph’));

模板

  • 用法一
javascript">let obj = {
    username : 'lisi',
    age : '12',
    gender : 'male'
}

 let tag = '<div><span>'+obj.username+'</span><span>'+obj.age+'</span><span>'+obj.gender+'</span></div>';
 console.log(tag);
  • 用法二
javascript">// 反引号表示模板，模板中的内容可以有格式，通过${}方式填充数据
let fn = function(info){
    return info;
}
let tpl = `
    <div>
        <span>${obj.username}</span>
        <span>${obj.age}</span>
        <span>${obj.gender}</span>
        <span>${1+1}</span>
        <span>${fn('nihao')}</span>
    </div>
`;
console.log(tpl);

函数解析

/*
    函数扩展
    1、参数默认值
    2、参数解构赋值
    3、rest参数
    4、...扩展运算符
*/
  • 默认值
javascript"> function foo(param){
    let p = param || 'hello';
		console.log(p);
	}
	foo('hi');
  • 参数默认值
javascript">	function foo(param = 'nihao'){
		console.log(param);
	}
	foo('hello kitty');

参数解析

  • 参数解构赋值
javascript">	function foo(uname='lisi',age=12){
		console.log(uname,age);
	}
	// foo('zhangsan',13);
	foo(); //默认值
  • 参数解构赋值
javascript">	function foo({uname='lisi',age=13}={}){
		console.log(uname,age);
	}
	//foo({}); //function foo({uname,age})
	foo();
	foo({uname:'zhangsan',age:15});
  • 剩余参数
javascript">	//rest参数（剩余参数）
	function foo(a,b,...param){
		console.log(a); //1
		console.log(b); //2
		console.log(param); //[3,4,5]
	}
	foo(1,2,3,4,5);
  • 扩展运算符 …
javascript">function foo(a,b,c,d,e,f,g){
    console.log(a + b + c + d + e + f + g);
}
// foo(1,2,3,4,5);
let arr = [1,2,3,4,5,6,7];
// foo.apply(null,arr);
foo(...arr);
  • 合并数组
javascript">let arr1 = [1,2,3];
let arr2 = [4,5,6];
let arr3 = [...arr1,...arr2];
console.log(arr3); //[1,2,3,4,5,6]

箭头函数

  • 箭头函数1
javascript">	function foo(){
		console.log('hello');
	}
	foo();

等价于

javascript">	let foo = () => console.log('hello');
	foo();
  • 箭头函数2
javascript">	function foo(v){
		return v;
	}

等价于

javascript">	let foo = v => v;
	let ret = foo(111);
	console.log(ret);

多个参数

  • 多个参数必须用小括号包住
javascript">	let foo = (a,b) =>console.log(a + b);
	foo(1,2);
  • 多个参数必须用小括号包住
javascript">let foo = (a,b) => {let c = 1; console.log(a + b + c);}
foo(1,2);
  • 遍历数组
javascript">	let arr = [123,456,789];
	arr.forEach(function(element,index){
		console.log(element,index);
	});
	//输出 123 0 ， 456 1 ， 789 2
  • 箭头函数遍历数组
javascript">	arr.forEach((element,index)=>{
		console.log(element,index);
	});
	//输出 123 0 ， 456 1 ， 789 2
  • 箭头函数的注意事项：
javascript">	//1、箭头函数中this取决于函数的定义，而不是调用
	function foo(){
		// 使用call调用foo时，这里的this其实就是call的第一个参数
		// console.log(this);
		setTimeout(()=>{
			console.log(this.num);
		},100);
	}
	foo.call({num:1});
  • ** 箭头函数不可以new**
javascript">// let foo = () => { this.num = 123;};
// new foo(); //报错不是一个有效的构造函数
  • 箭头函数不可以使用arguments获取参数列表，可以使用rest参数代替
javascript">// let foo = (a,b) => {
//     // console.log(a,b);
//     console.log(arguments);//这种方式获取不到实参列表
// }
// foo(123,456);

 let foo = (...param) => {
    console.log(param);
}
foo(123,456 );

类与继承

javascript">	function Animal(name){
		this.name = name;
	}
	Animal.abc = function(){};
	$.ajax = function(){};
	Animal.prototype.showName = function(){
		console.log(this.name);
	}
	var a = new Animal('Tom');
	a.showName();
	var a1 = new Animal('Jerry');
	a1.showName();

静态方法

javascript">class Animal{
    // 静态方法(静态方法只能通过类名调用，不可以使用实例对象调用)
    static showInfo(){
        console.log('hi');
    }
    // 构造函数
    constructor(name){
        this.name = name;
    }

    showName(){
        console.log(this.name);
    }
}

类的继承extends

javascript">class Dog extends Animal{
    constructor(name,color){
        super(name);//super用来调用父类
        this.color = color;
    }

    showColor(){
        console.log(this.color);
    }
}

let d = new Dog('doudou','yellow');
d.showName();
d.showColor();
// d.showInfo();
Dog.showInfo();

http://www.niftyadmin.cn/n/809049.html

相关文章

cc-inspector+

cc-inspector+

前言许彦峰&#xff1a;江湖人称插件小王子&#xff0c;在Cocos Creator扩展商店上架近十款余款插件。而且插件小王子的大部分插件是免费分享、提供源码&#xff0c;真乃Cocos社区的一名活雷锋。今天小王子再发神威&#xff0c;提供一款惊世之作&#xff0c;它可以让您在Cocos …
阅读更多...
CreatorPrimer | 从zIndex开始

CreatorPrimer | 从zIndex开始

1. 引言 从Cocos2d-x/lua/js过来的老鸟们肯定发现了&#xff0c;在CocosCreator属性检查器中Node节点竟然没有zIndex属性。 可就因为这一点&#xff0c;UI节点的遮挡关系控制不便&#xff0c;经常让策划、测试、甚至老板经常找程序员麻烦。不知道大家有没想过要用编辑器去控制…
阅读更多...
RedHat5.5 升级安装GCC-4.6.1详细教程

RedHat5.5 升级安装GCC-4.6.1详细教程

一、什么是Gcc Linux系统下的Gcc&#xff08;GNU C Compiler&#xff09;是GNU推出的功能强大、性能优越的多平台编译器&#xff0c;是GNU的代表作品之一。gcc是可以在多种硬体平台上编译出可执行程序的超级编译器&#xff0c;其执行效率与一般的编译器相比平均效率要高20%~30%…
阅读更多...
IIS 命令

IIS 命令

inetmgr 找开IIS 管理器 iisreset 重启IIS start 启动IIS stop 停止IIS转载于:https://www.cnblogs.com/challengesoflife/archive/2011/10/05/2199651.html
阅读更多...
mac下#include nested too deeply错误处理

mac下#include nested too deeply错误处理

如果遇到下面这种错误&#xff1a; /usr/local/include/stdint.h:2:10: error: #include nested too deeply #include <stddef.h> ^ /usr/local/include/stdint.h:59:11: error: #include nested too deeply # include <stdint.h> ^ /usr/local/include…
阅读更多...
CreatorPrimer | scale与size

CreatorPrimer | scale与size

在CocosCreator引擎编辑中&#xff0c;节点的scale和size属性都可以改变节点内容的大小&#xff0c;如下图中可爱的椰子头&#xff0c;原图尺寸为512*512&#xff0c;在UI编辑时发现太大了&#xff0c;需要128*128的大小更适合。 此时将节点scale属性设置为0.25好&#xff0c;还…
阅读更多...
比较字符串

比较字符串

.NET Framework 提供多个方法来比较字符串的值。 下表列出并描述了这些值比较方法。 方法名 使用 String.Compare 比较两个字符串的值。 返回一个整数值。 String.CompareOrdinal 比较两个字符串而不考虑本地区域性。 返回整数值。 String.CompareTo 将当前字符串对象与另一个…
阅读更多...
jwt-cpp cmake 编译

jwt-cpp cmake 编译

1、通过工具安装&#xff1a; windows下可以使用vcpkg安装openssl ubuntu下可以sudo apt-get install libssl-dev cmake lcov安装依赖 mac下可以brew install cmake lcov openssl1.1安装依赖 2、通过源码安装&#xff1a; 到openssl官网下载压缩包 http://www.openssl.org…
阅读更多...
最新文章

Copyright @ 2022~2023