插值拼接
var a="11";
console.log(`aa:${a}`);
aa:11
注是`` 不是‘’ ,
image.png
js自动拆分字符串
function test(template,name){console.log(template,name);}
var myname="zhangsan";
test`my name is ${myname}`; //不要括号 否则整个会做为第一个参数传入
//(2) ["my name is ", "", raw: Array(2)] "zhangsan"
test 形参中template 接收到的是数组
参数默认值
function test(t = 3, s = 4) {
return t + s;
}
test();
可变参数
function test1(...a){console.log(a}
test(1,2,3,4) //此时a的结果为数组
function test(t = 3, s = 4) {
return t + s;
}
test(...[1,2]) //3
function f(...[a, b, c]) {
return a + b + c;
}
f(1) // NaN (b and c are undefined)
f(1, 2, 3) // 6
f(1, 2, 3, 4) // 6 (the fourth parameter is not destructured)
generator
function *dosome(){console.log("start");yield 10;console.log("end");}
var t=dosome()
t.next()
//VM2689:1 start
//{value: 10, done: false} 10是yield的返回值
t.next()
//VM2689:1 end
//{value: undefined, done: true}
t.next()
//{value: undefined, done: true}
析构表达式
//析构对象
var {code,price}={code:11,price:12}
code //11
price //12
function getStock(){return {code:"ibm",proce:100}};
var {code,proce}=getStock() //注变量名要一致 不一致解构不到的
var {code:code,price:proce}=getStock() //或者这样
//析构嵌套格式
var {code,price}={code:11,price:{price1:12,price2:13}}
price // {price1: 12, price2: 13} 此时price是对象
var {code,price:{price2}}={code:11,price:{price1:12,price2:13}}
price //对象{price1: 12, price2: 13}
price2 //13 即解析了price 也解析了price2
//析构数组
var arr=[1,2,3];
var [n1,n2]=arr
n1 //1
n2 //2
var [,,n3]=arr
n3 //3 //前面几个,就是第几个
var [n1,n2,...other]=arr
other //[3] 除第一个元素第二个元素 以外的其余元素
//注传参
遍历
var arr=[1,2,3,4]
arr.desc="5"
//(4) [1, 2, 3, 4, desc: "5"]
arr.forEach(item=>console.log(item))
//1
//2
//3
//4 不会遍历到desc
for (let ite in arr){console.log(ite))}
//0 返回的下标
// 1
//2
// 3
//desc
for (let ite of arr){console.log(ite)}
//1
//2
//3
//4 可提前结束掉 break foreach不可结束
class
class t {
constructor(a="1") {this.a=a;
}
}
var t1 = new t();
//t {a: "1"}
var t2 = new t("444");
//t {a: "444"}
class T2 extends t{} //继承
var t3=new T2("111")
t3 //T2 {a: "111"}
Array flat flatmap
flat()接收一个数组(这个数组中的某些item本身也是一个数组),返回一个新的一维数组(如果没有特别指定depth参数的话返回一维数组)。
const arr= [ "a", ["b", "c"], ["d", ["e", "f"]]];
// .flat() 接收一个可选的深度参数
const arr2= arr.flat( 2 );
console.log( arr2); // [ "a", "b", "c", "d", "e", "f" ]
flatMap()类似于map(),但是它的callback返回的是扁平的一维数组(如果没有特别指定depth参数的话)。
const scattered = [ "my favorite", "hamburger", "is a", "chicken sandwich" ];
// map() 返回的是嵌套的数组results in nested arrays
const huh = scattered.map( chunk => chunk.split( " " ) );
console.log( huh ); // [ [ "my", "favorite" ], [ "hamburger" ], [ "is", "a" ], [ "chicken", "sandwich" ] ]
const better = scattered.flatMap( chunk => chunk.split( " " ) );
console.log( better ); // [ "my", "favorite", "hamburger", "is", "a", "chicken", "sandwich" ]
decodeURI() decodeURIComponent()的区别
decodeURI(URIstring)
//函数可对 encodeURI() 函数编码过的 URI 进行解码。
//URIstring 一个字符串,含有要解码的 URI 或其他要解码的文本。
decodeURIComponent(URIstring)
//函数可对 encodeURIComponent() 函数编码的 URI 进行解码。
//URIstring 一个字符串,含有编码 URI 组件或其他要解码的文本。
encodeURIComponent和decodeURIComponent可以编码和解码URI特殊字符(如#,/,¥等),而decodeURI则不能。
encodeURIComponent('#')
"%23"
decodeURI('%23')
"%23"
decodeURIComponent('%23')
"#"
encodeURI('#')
"#"
可以看出encodeURI和decodeURI对URI的特殊字符是没有编码和解码能力的,实际项目中我们一般需要get请求的方式在地址栏中拼接一些参数,但是参数中如果出现#,/,&这些字符,就必须要用decodeURIComponent了,不然这些特殊字符会导致我们接收参数的错误
假如我们要传一个code字段到http://www.xxx.com,值为20180711#abc
var codeVal = encodeURI('20180711#abc');
var url = 'http://www.xxx.com?code=' + codeVal;
console.log(url);
http://www.xxx.com?code=20180711#abc
http://www.xxx.com接收参数
location.search //"?code=20180711";
decodeURI("?code=20180711") //"?code=20180711"
这时候我们拿到的code参数明显是错误的,被特殊字符#截断了,下面我们来看用decodeURIComponent方法:
var codeVal = encodeURIComponent('20180711#abc');
var url = 'http://www.baidu.com?code=' + codeVal;
url;
"http://www.baidu.com?code=20180711%23abc"
http://www.xxx.com接收参数
location.search //"?code=20180711%23abc"
decodeURIComponent("?code=20180711%23abc") //"?code=20180711#abc"
这样子看来参数是不是正确了呢?
bind
function.bind(thisArg[,arg1[,arg2[, ...]]])
参数
thisArg
调用绑定函数时作为this参数传递给目标函数的值。 如果使用new运算符构造绑定函数,则忽略该值。当使用bind在setTimeout中创建一个函数(作为回调提供)时,作为thisArg传递的任何原始值都将转换为object。如果bind函数的参数列表为空,执行作用域的this将被视为新函数的thisArg。
arg1, arg2, ...
当目标函数被调用时,预先添加到绑定函数的参数列表中的参数。
返回值
返回一个原函数的拷贝,并拥有指定的this值和初始参数。
this.num = 9;
var mymodule = {
num: 81,
getNum: function() { return this.num; }
};
module.getNum(); // 81
var getNum = module.getNum;
getNum(); // 9, 因为在这个例子中,"this"指向全局对象
// 创建一个'this'绑定到module的函数
var boundGetNum = getNum.bind(module);
boundGetNum(); // 81
//call apply bind区别
var obj = {test: function() { console.log(this, arguments) }},
func = obj.test;
obj.test("Hello", ",", "world", "!");
// {test: ƒ} Arguments(4) ["Hello", ",", "world", "!", callee: ƒ, Symbol(Symbol.iterator): ƒ]
func.call(obj, "Hello", ",", "world", "!");
func.apply(obj, ["Hello", ",", "world", "!"]);
// {test: ƒ} Arguments(4) ["Hello", ",", "world", "!", callee: ƒ, Symbol(Symbol.iterator): ƒ]
//call 与apply的区别 只是传不一样,apply数组形式
func.apply({}, ["Hello", ",", "world", "!"]);
// {} Arguments(4) ["Hello", ",", "world", "!", callee: ƒ, Symbol(Symbol.iterator): ƒ]
var newFunc = func.bind(obj, "Hello", ","); //有初始参数序列
newFunc("world", "!");
// {test: ƒ}test: ƒ ()__proto__: Object Arguments(4) ["Hello", ",", "world", "!", callee: ƒ, Symbol(Symbol.iterator): ƒ]
newFunc();
// {test: ƒ} Arguments(2) ["Hello", ",", callee: ƒ, Symbol(Symbol.iterator): ƒ]
var newFunc2 = func.bind({}, "Hello", ",");
newFunc2("world", "!");
// {} Arguments(4) ["Hello", ",", "world", "!", callee: ƒ, Symbol(Symbol.iterator): ƒ]
aa
//fdsafsdf
网友评论