為了實踐一下es6，就通過es6簡單模擬了一下jq，實現了幾個小操作，如$(function())，事件繫結，獲取設定css，設定動畫及鏈式操作
**比較簡單，有些地方的錯誤處理也沒有加上，**直接貼上
效果如下，
圖1原始圖
點選按鈕演示1，分別設定第二個box1的文字顏色和三個box1的背景色，效果見圖2
點出按鈕演示2，通過動畫改變box2的位置，見圖2
圖1
圖2
圖3
doctype html>
<
html
lang
="en"
>
<
head
>
<
meta
charset
="utf-8"
>
<
meta
name
="viewport"
content
="width=device-width, initial-scale=1.0"
>
<
title
>es6簡單模擬jq
title
>
<
style
>
* div
.block1
.box1
.block2
.box2
style
>
head
>
<
body
>
<
div
class
="block1"
>
<
button
>演示1
button
>
<
button
>演示2
button
>
div>
<
div
class
="block1"
>
<
div
class
="box1"
>box1
div>
<
div
class
="box1"
>box1
div>
<
div
class
="box1"
>box1
div>
div>
<
div
class
="block2"
>
<
div
class
="box2"
>box2
div>
div>
<
script
>
class jq
else
if(typeof
arg
==="
string
")
elseif(
typeof
arg
==="
function
")
else
else}}
addelems(eles)
this
.length
=eles.length;
}//click事件
click(fn)
}//繫結事件
on(eventname, fn)
}return
this
; }
eq(index)
get(index)
end()
css(...args)
else}}
} else
}return
this
; }
getstyle(ele, stylename)
setstyle(ele, stylename, stylevalue)
animate(...args)
} elseif(
typeof
args[1]
==="
number")
}let seconds
=speed
/1000
;
for(let i =0
; i
<
this
.length; i
++)
if(typeof
args[args.length -1
] ===
"function
") );}}
return
this
; }
}function
$(arg)
script
>
<
script
>
//演示
//jq的 $(functoin(){});
//繫結事件
//獲取設定css
//簡單的動畫效果
$(function
() );
});//$(
"button
").eq(
1).on(
"click",
function
() ,
3000
); });
})script
>
body
>
html
>
es6的一些技巧
1,強制要求引數 es6 有預設引數設定機制 允許在入參的括號裡給引數賦予預設值 防止函式在呼叫時沒有傳參 我們知道在js函式在入參的時候是入幾個都可以的 這就給了我們發揮的空間，我們來強制要求引數必須有 否則就報錯 const required const add a required b req...
es6的一些筆記
new set 用來去重陣列。let arr 1,2,2,3 let set new set arr let newarr array.from set console.log newarr 1,2,3 set類似於陣列，區別在於它所有的成員都是唯一的，不能有重複的值 展開運算子 合併陣列 let ...
總結 es6的一些語法
一 let關鍵字 1.作用 let與var相同，用於宣告乙個變數，2.特點 let在塊作用域內有效 不能重複宣告 不會預處理，不存在提公升 3.應用 迴圈遍歷加監聽 二 const 定義常量，不可以去修改 三 變數的解構賦值 let obj let obj 輸出結果koke 30 let arr 1...