ホーム エクスプローラ ヘルプ
サインイン
lovecoding
/
W250913
10
0
フォーク 0

2 コミット 4254c306a4 ... f0bd214ffa

作者 SHA1 メッセージ 日付
  fengchuanyu f0bd214ffa admin 1 日 前
  fengchuanyu 04bb694768 admin 1 日 前
5 ファイル変更、313 行追加、0 行削除
一括表示 差分情報を表示
  1. BIN
      .DS_Store
  2. 37 0
      8_ES6/17_原型.html
  3. 80 0
      8_ES6/18_判断数据类型.html
  4. 33 0
      8_ES6/19_深拷贝&浅拷贝.html
  5. 163 0
      8_ES6/练习题3_讲解.html

BIN
.DS_Store
ファイルの表示


+ 37 - 0
8_ES6/17_原型.html
ファイルの表示 

@@ -0,0 +1,37 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+</head>
 
+<body>
 
+    <script>
 
+        function foo(){
 
+            console.log("hello");
 
+        }
 
+        // console.log(foo.prototype);
 
+
 
+        var arr = [1,2,3];
 
+        // prototype 原型对象 任何对象下都会有原型 原型中有内置的方法 我们也可以向其中添加属性和方法
 
+        // 数组的原型是Array.prototype
 
+        // __proto__ 构造出的对象 指向的原型
 
+        console.log(arr.__proto__);
 
+        console.log(Array.prototype);
 
+        console.log(Number.prototype);
 
+        console.log(String.prototype);
 
+        Array.prototype.loveCoding = function(){
 
+            console.log("I love coding");
 
+            console.log(this);
 
+        }
 
+        arr.loveCoding();
 
+
 
+        Function.prototype.loveCoding = function(){
 
+            console.log("I love coding");
 
+        }
 
+        foo.loveCoding();
 
+        
+
 
+    </script>
 
+</body>
 
+</html>

+ 80 - 0
8_ES6/18_判断数据类型.html
ファイルの表示 

@@ -0,0 +1,80 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+</head>
 
+<body>
 
+    <script>
 
+        let str = "hello";
 
+        let num = 10;
 
+        let bool = true;
 
+        let und = undefined;
 
+        let nul = null;
 
+        let arr = [1,2,3,4,5,6,7,8,9];
 
+        let obj = {a:10};
 
+        let fun = function () {
 
+            console.log("hello");
 
+        }
 
+
 
+        // typeof 运算符
 
+        // typeof 运算符可以判断一个变量的数据类型
 
+        // 返回一个字符串 表示数据类型
 
+        // 一般用作于判断基本数据类型,除了null 和对象返回都是object
 
+        // console.log(typeof str); // string
 
+        // console.log(typeof num); // number
 
+        // console.log(typeof bool); // boolean
 
+        // console.log(typeof und); // undefined
 
+        // console.log(typeof nul); // object
 
+        // console.log(typeof arr); // object
 
+        // console.log(typeof obj); // object
 
+
 
+        // instanceof 运算符
 
+        // instanceof 运算符可以判断一个对象是否是一个类的实例
 
+        // 返回一个布尔值
 
+        // 一般用作于判断引用数据类型 数组 对象 函数
 
+        // console.log(str instanceof String); // false
 
+        // console.log(num instanceof Number); // false
 
+        // console.log(bool instanceof Boolean); // false
 
+        // console.log(und instanceof undefined); // false
 
+        // console.log(nul instanceof null); // false
 
+        // console.log(arr instanceof Array); // true
 
+        // console.log(obj instanceof Object); // true
 
+        // console.log(fun instanceof Function); // true
 
+
 
+        // constructor 构造函数
 
+        // constructor 可以判断一个变量的数据类型
 
+        // 返回一个字符串 表示数据类型
 
+        // 除了 null 和 undefined 其他都可以使用 constructor 来判断数据类型
 
+        // console.log(str.constructor); // function String() { [native code] }
 
+        // console.log(num.constructor); // function Number() { [native code] }
 
+        // console.log(bool.constructor); // function Boolean() { [native code] }
 
+        // console.log(und.constructor); // undefined
 
+        // console.log(nul.constructor); // null
 
+        // console.log(arr.constructor); // function Array() { [native code] }
 
+        // console.log(obj.constructor); // function Object() { [native code] }
 
+        // console.log(fun.constructor); // function Function() { [native code] }
 
+
 
+        // 通过 Object.prototype.toString.call() 来判断数据类型
 
+        // 可以判断所有数据类型
 
+        // 返回一个带有类型名称的字符串
 
+        // console.log(Object.prototype.toString.call(str)); // [object String]
 
+        // console.log(Object.prototype.toString.call(num)); // [object Number]
 
+        // console.log(Object.prototype.toString.call(bool)); // [object Boolean]
 
+        // console.log(Object.prototype.toString.call(und)); // [object Undefined]
 
+        // console.log(Object.prototype.toString.call(nul)); // [object Null]
 
+        // console.log(Object.prototype.toString.call(arr)); // [object Array]
 
+        // console.log(Object.prototype.toString.call(obj)); // [object Object]
 
+        // console.log(Object.prototype.toString.call(fun)); // [object Function]
 
+
 
+
 
+        // 判断数组
 
+        console.log(Array.isArray(arr))
 
+
 
+
 
+        
+
 
+    </script>
 
+</body>
 
+</html>

+ 33 - 0
8_ES6/19_深拷贝&浅拷贝.html
ファイルの表示 

@@ -0,0 +1,33 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+</head>
 
+<body>
 
+    <script>
 
+        let arr = [1,2,["a","b"],3,4];
 
+        // let arr2 = arr;
 
+        let arr2 = [...arr];
 
+        arr[0]= "a";
 
+        arr[2][0] = "hello";
 
+        console.log(arr2);
 
+
 
+        let obj = {
 
+            a:1,
 
+            b:2,
 
+            c:{
 
+                x:100,
 
+                y:200
 
+            }
 
+        }
 
+        // let obj2 = obj;
 
+        let obj2 = {...obj};
 
+        obj.a = 100;
 
+        obj.c.x = 1000;
 
+        console.log(obj2);
 
+        
+    </script>
 
+</body>
 
+</html>

+ 163 - 0
8_ES6/练习题3_讲解.html
ファイルの表示 

@@ -0,0 +1,163 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
+    <title>Document</title>
 
+</head>
 
+
 
+<body>
 
+    <script>
 
+        //1、写出下列输出结果
 
+        // var x = 10;
 
+        // function test() {
 
+        //     var x = 20
 
+        //     console.log(this.x)//10
 
+        // }
 
+        // test()
 
+
 
+        //2、写出下列输出结果
 
+        // var name = "window"
 
+        // var obj = {
 
+        //     name: "obj",
 
+        //     func1: function () {
 
+        //         console.log(this.name);//obj
 
+        //         (function () {
 
+        //             console.log(this.name)//window
 
+        //         })()
 
+        //     }
 
+        // }
 
+        // obj.func1()
 
+
 
+        //3、写出下列结果
 
+        // var name = "the window";
 
+        // var object = {
 
+        //     name: "My Object",
 
+        //     getName: function () {
 
+        //         return this.name;
 
+        //     }
 
+        // }
 
+
 
+        // console.log(object.getName());//My Object
 
+        // console.log((object.getName)());//My object
 
+        // console.log((object.getName = object.getName)());//the window
 
+
 
+        // console.log(object.getName);
 
+        // let foo = function () {
 
+        //         return this.name;
 
+        //     };
 
+        // console.log(foo());
 
+        // var a = 10;
 
+        // var b = 20;
 
+        // if(a = b){
 
+        //     console.log("true");
 
+        // }
 
+
 
+
 
+        //4、下列代码中当div的点击事件触发时输出的结果是？
 
+        // document.getElementById("div").onclick = function () {
 
+        //     console.log(this)//div
 
+        // };
 
+
 
+
 
+        //5、请写出下列代码运行结果
 
+        // var name = "window"
 
+        // var obj = {
 
+        //     name: "obj"
 
+        // }
 
+        // setInterval(function () {
 
+        //     console.log(this.name)//每隔300ms输出window
 
+        // }, 300)
 
+        // setInterval(function () {
 
+        //     console.log(this.name)//输出一次obj
 
+        // }.call(obj), 300)
 
+
 
+
 
+        //6、请补全下列代码
 
+        // function foo() {
 
+        //     //补全此处代码实现每隔一秒输出 hello world
 
+        //     // console.log("hello world");
 
+        //     return function(){
 
+        //         console.log("hello world");
 
+        //     }
 
+        // }
 
+        // window.setInterval(foo(), 1000);
 
+
 
+        // 7、补全下列代码实现 1+2+3+4
 
+        function add(c, d) {
 
+            return this.a + this.b + c + d;
 
+        }
 
+
 
+        // var obj = {
 
+        //     a: 1,
 
+        //     b: 2
 
+        // }
 
+        // var res = add.call(obj, 3, 4);
 
+
 
+        // var a = 1;
 
+        // var b = 2;
 
+        // var res = add(3,4);
 
+        // console.log(res);//10
 
+
 
+        //8、写出下列输出结果
 
+        // function f() {
 
+        //     return this.a;
 
+        // }
 
+
 
+        // // bind 方法只能绑定一次 不能再次绑定 如果出现多次绑定 以最第一次绑定为准
 
+        // var g = f.bind({ a: "azerty" });
 
+        // console.log(g());//azerty
 
+
 
+        // var h = g.bind({ a: 'yoo' });
 
+        // console.log(h());//azerty
 
+
 
+        // var o = { a: 'loveCoding', f: f, g: g, h: h };
 
+        // console.log(o.f(), o.g(), o.h());//loveCoding azerty azerty
 
+
 
+
 
+        //9、补全下列代码
 
+        // var o = { prop: 'loveCoding' };
 
+
 
+        // function independent() {
 
+        //     return this.prop;
 
+        // }
 
+        // //在此补全代码
 
+        // o.f = independent;
 
+        // console.log(o.f()); //  loveCoding
 
+
 
+        //10、用call 或 apply 实现bind 方法
 
+        function foo(i,j) {
 
+            console.log(this.a,i,j)
 
+        }
 
+        // function fo2(){
 
+
 
+        //     console.log(this.a);
 
+            
+        // }
 
+        var obj = {
 
+            a: "hello"
 
+        }
 
+
 
+        // 在函数对象（Function）下添加一个bind2方法
 
+        Function.prototype.bind2 = function(context){
 
+            let _this = this;
 
+            // console.log(arguments);
 
+            // let arg = Array.from(arguments).slice(1);
 
+            var arg = Array.prototype.slice.call(arguments,1);
 
+            // console.log(arg);
 
+            return function(){
 
+                // _this.call(context,...arg);
 
+                _this.apply(context,arg);
 
+            }
 
+        }
 
+
 
+
 
+        var foo2 = foo.bind2(obj,1,2);
 
+        // var foo3 = fo2.bind2(obj);
 
+        foo2()
 
+        // foo3()
 
+    </script>
 
+</body>
 
+
 
+</html>