对象内置方法,继承,instanceof添加上(安全使用)

最新推荐文章于 2023-01-27 16:39:34 发布
最新推荐文章于 2023-01-27 16:39:34 发布
阅读量320 收藏
点赞数
分类专栏： 知识点
instanceof添加上(安全使用)
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <meta name="Author" content="">
        <meta name="Keywords" content="">
        <meta name="Description" content="">
        <title>Document</title>
        <style type="text/css">
            * {margin: 0; padding: 0;}
            a {text-decoration: none;}
            ul,li {list-style: none;}
            body {font-family: "Microsoft yahei";}
        </style>
    </head>
<body>

<script type="text/javascript">
    /*
        instanceof 检测创建的对象是由谁实例得到的 new 出来的

        ####构造函数单独执行 是没有任何意义的
        只有在new的时候才会有意义
     */

    // function Person(names,age){
    //     this.names = names;
    //     this.age = age;
    // };
    // Person.prototype.eat = function(){
    //     console.log(this.names);
    // };
    // Person.prototype.type = "bitch";

    // var p1 = new Person("pr",1213);
    // console.log(p1.names+"====="+p1.age);

    // 安全使用添加instanceof
    function Person(name,age){
        if(this instanceof Person){  //作防止措施.==>防止this指向window
            this.names = name;
            this.age = age;
        }else{
            return new Person(name,age);
        }
    };

    // var p1 = Person("pr",123);  //可以不用new
    var p1 = new Person("pr",123);
    alert(p1.names)
</script>
</body>
</html>
对象内置方法
        数据类型 object -- json
                object

        constructor             判断来自哪一个构造函数
        in                      判断一个属性是否存在于对象中(不分是不是继承的属性或者方法)
        hasOwnProperty          判断自有属性
        isPrototypeOf           判断来自哪一个原型链
        propertyIsEnumerable    属性是否可以被for in
        toString                转成一个字符串
        valueOf                 生成一个副本 引用地址的一样的

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="Author" content=" ">
    <title>Document</title>
    <style type="text/css">
        *{margin: 0;padding: 0;}
        a{text-decoration: none;}
        ul,li{list-style: none;}
        body{font-size: 14px;font-family: "微软雅黑";}
    </style>
</head>
<body>
    <script type="text/javascript">
        /*
            数据类型 object -- json
            object

            constructor             判断来自哪一个构造函数
            in                      判断一个属性是否存在于对象中(不分是不是继承的属性或者方法)
            hasOwnProperty          判断自有属性
            isPrototypeOf           判断来自哪一个原型链
            propertyIsEnumerable    属性是否可以被for in
            toString                转成一个字符串
            valueOf                 生成一个副本 引用地址的一样的
         */


        function Person(name,age){
            //自有属性
            this.name = name;
            this.age = age;
            this.say = function(){
                alert(1);
            };
        };

        //扩展属性
        Person.prototype.eat = function(){
            alert("eat");
        };
        Person.prototype.type = "人类";

        var p1 = new Person("xq",18);
        var p2 = new Person("cc",20);

        for(var k in Person.prototype){
            console.log(Person.prototype[k]);
        };

        // alert(Person.prototype.constructor);
        /*
            in
            hasOwnProperty
            isPrototypeOf
         */
        // alert(p1.eat === p2.eat);//true
        // alert(p1.say === p2.say);//false
        // alert("eat" in p1);//true
        // alert("say" in p1);//true
        // alert(p1.hasOwnProperty("name"));//true     自己的
        // alert(p1.hasOwnProperty("type"));//false    原型链
        // alert(p1.hasOwnProperty("valueOf"));//false object

        // alert(Person.prototype.isPrototypeOf(p1));//true




        // var json1 = {
        //     name:'xq'
        // };

        // var json2 = json1.valueOf();
        // alert(json1 === json2);
        // json2.name = "茅草屋";
        // alert(json1.name);

        // var date = new Date();
        // var d = date.toLocaleString();
        // document.write(d);
    </script>
</body>
</html>
extend继承拷贝
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <meta name="Author" content="">
        <meta name="Keywords" content="">
        <meta name="Description" content="">
        <title>Document</title>
        <style type="text/css">
            * {margin: 0; padding: 0;}
            a {text-decoration: none;}
            ul,li {list-style: none;}
            body {font-family: "Microsoft yahei";}
        </style>
    </head>
<body>

<script type="text/javascript">
    /*
        继承extends
            子类可以继承父类
            子类可以使用父类的方法或者属性
            子类不可以影响父类(重写)
     */

    function Person(name){
        if(this instanceof Person){
            this.name = name;
        }else{
            return new Person(name);
        }
    };
    Person.prototype.showName = function(){
        alert(this.name);
    };
    var p = Person("goudan");
    // p.showName();

    function Child(name,age){
        if(this instanceof Child){
            this.age = age;
            this.name = name;
        }else{
            return new Child(name,age);
        }
    };

    // Child.prototype = Person.prototype;  //子类不可以影响父类
    // Child.prototype = extend(Person.prototype);  //相当于字面量扩展  ===>会把constructor改变成Object
    extend(Person.prototype,Child.prototype);
    Child.prototype.showAge = function(){
        alert(this.age);
    };

    var c = Child("ergou",18);
    // c.showAge();
    c.showName();
    // alert(c.constructor);//Object
    // p.showAge();//子类不可以影响父类
    function extend(obj,childObj){  //正确的做法.
        // var childObj = {};
        for(var k in obj){
            // 继承父类的属性,方法.   原型链的
            childObj[k] = obj[k];
        };
        // return childObj;
    };
</script>
</body>
</html>

类继承

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <meta name="Author" content="">
        <meta name="Keywords" content="">
        <meta name="Description" content="">
        <title>Document</title>
        <style type="text/css">
            * {margin: 0; padding: 0;}
            a {text-decoration: none;}
            ul,li {list-style: none;}
            body {font-family: "Microsoft yahei";}
        </style>
    </head>
<body>

<script type="text/javascript">
    /*
        继承extends
            子类可以继承父类
            子类可以使用父类的方法或者属性
          !!做到子类不可以影响父类(重写)
     */

    function Person(name){
        // if(this instanceof Person){
            this.name = name;
        // }else{
        //     return new Person(name);
        // }
    };
    Person.prototype.showName = function(){
        alert(this.name);
    };
    var p = new Person("goudan");

    function Fn(){

    };
    Fn.prototype = Person.prototype;//==> Fn的constructor=>Person
    Child.prototype = new Fn();  //onstructor=>Person
    Child.prototype.constructor = Child;//手动改回来.
    function Child(name,age){
        if(this instanceof Child){
            this.age = age;
            Person.call(this,name);
        }else{
            return new Child(name,age);
        }
    };

    Child.prototype.showAge = function(){
        alert(this.age);
    };

    var c = Child("ergou",18);
    console.log(c.name);
    // c.showAge();
    c.showName();
    alert(c.constructor)//构造器一层一层找
    // p.showAge();
</script>
</body>
</html>
维克多噗噗
关注
专栏目录
面向对象中的继承：几种不同的继承方式及优缺点总结 。 call(),apply() 使用方式
jj16165858的博客
04-12 1300
// **面向对象中的继承性. // 继承可以解决代码复用，让编程更加靠近人类思维。 // 当多个类存在相同的属性(变量)和方法时，可以从这些类中抽象出父类， // 在父类中定义这些相同的属性和方法，所有的子类不需要重新定义这些属性和方法， // 只需要通过继承父类中的属性和方法。 // 1、创建一个人类然后继承学生类以及教师类， ......
继承，instanceof 关键字的使用
guonengneng的博客
10-09 232
package cn; /** * 继承，instanceof 关键字的使用 * @author 110 *继承使用要点 *1：父类也成为超类，基类，派生类 *2：java中只有单继承，没有像C++那样的多继承。多继承会引起混乱， *使得继承过于复杂，系统难以维护。 *3：java中没有多继承，接口有多继承。 *4：子类继承父类，可以得到父类的全部属性和方法（除了父类的构造方...
方法的重写、类的继承、instanceof的作用及用法
tudanbaotian的博客
02-14 152
hello，大家好，兔胆包天又来啦，今天讨论的是标题的内容，代码中我已经写了详细的注释，相信大家一定能看懂，加油哦。 package duiXiangHeLei; public class Animal { int number; String name; public void eat(){ System.out.println("根据种类吃东西"); } public static void main(String[]args){
instanceof()的完全检测
ZixiangLi的博客
11-03 599
1. 安全的类型检测 JavaScript内置的类型检测机制并非完全可靠。 var isArray = value instanceof Array;1 以上代码要返回true，value必须是一个数组，而且还必须与Array构造函数在同个全局作用域中。（Array是window的属性）如果value是在另外一个iframe中定义的数组，上述代码则返回false。  注意：BOM的
this相关问题
weixin_60789461的博客
08-22 344
this相关问题
高频面试手写代码练习3--bind
Y丶小琪
03-04 115
Function.prototype.myBind=function(context){ if(typeof this!=='function'){ throw new TypeError('error') } let args=[...arguments].slice(1) let fn=this return function Fn(){ //this instanceo..
js代码-继承内置类型
07-15
在JavaScript中，继承是面向对象编程的一个核心特性，它允许我们创建基于现有对象的新对象，共享和扩展其属性和方法。这个压缩包“js代码-继承内置类型”显然是关于JavaScript中如何实现对内置类型的继承，比如Array...
JavaScript实现继承的4种方法总结
12-11
另外，对于支持ECMAScript 5的浏览器，可以使用`Object.create`方法来实现对象继承，这比原型链继承更安全且易于理解： ```javascript var Base = function() { this.level = 1; this.name = "base"; this....
JavaScript对象深度解析：属性、方法与内置对象
包括对象属性、对象方法、创建对象的四种方法、对象比较、原型（prototype）和原型链（prototype chain）、基于原型链的继承、删除属性、静态属性（static）、setter和getter、常用的内置对象如Function、Number、...
手写call,apply,bind
又一个四季在轮回
09-14 180
实现call Function.prototype.myCall = function(context){ if(typeof this != 'function') throw new Error('type Error'); context = context || window//context上下文，指要指向的对象 const args = [...arguments].slice(1);//接收到的参数，因为第一个参数为要改变的this,不加入参数列表,用数组包
Javascript手写系列（1）
最新发布
qq_47218954的博客
01-27 152
Javascript常考手写编程系列（一期6道）
手写call、apply、bind
passWordEnterX的博客
10-12 261
4、call、apply是立即执行，bind是返回绑定this之后的函数，如果这个新的函数作为构造函数被调用，那么this不再指向传入给bind的第一个参数，而是指向新生成的对象。2、三者第一个参数都是this要指向的对象，若该参数为undefined或null，this则默认指向全局window。3、传参不同：apply是数组、call是参数列表，而bind可以分为多次传入，实现参数的合并。1、三者都可以显式绑定函数的this指向。
JS的instanceof 有多坑？
LiX07的博客
02-25 864
JS的instanceof到底是有多坑？ instanceof填坑 说instanceof就不得不顺带说一下typeof，请跟着。 typeof typeof操作符返回一个字符串，表示未经计算的操作数的类型。 就这么几种类型：number、boolean、string、object、undefined、function、symbol。 typeof 1 // "number" typeof '1' // "string" typeof true // "boolean" typeof Symbol(1) /
new操作符
imkaifan的博客
05-10 146
function fn() { console.log(this instanceof fn); console.log(this) } fn.prototype.a = 111 fn() let aa = new fn() console.lo...
jQuery深入之源码解析（四）——分离构造器
Daisy花园
06-07 868
继续来看构造函数 var jQuery = function( selector, context ) { return new jQuery.fn.init( selector, context ); //这里用new，省去了构造函数jQuery()前面的运算符new，因此我们可以直接写jQuery() }, ... ; jQue
java中instanceof关键字的使用，以及子类是否继承了父类的所有属性
苦涩
11-14 5266
今天在项目中遇到了个问题，就是
三种改变this指向操作
金金的博客
09-19 281
call 手写实现： Function.prototype.myCall = function(thisArg,...args){ if(typeof this != 'function'){ throw new TypeError('error') } const fn = Symbol('fn') //如果thisArg本身就有一个方法叫做fn怎么办？那不是调用call之后， //就会把它本身这个方法删掉了么？有的朋友会说，那起一个复杂点的函数名， //保证其他人不会起这
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值