Question

我想制作一个像这样的结构很好的代码： https://github.com/nolimits4web/Swiper/blob/master/dist/js/swiper.jquery.js#L67

所以，我做了这个。但它不起作用。 http://jsbin.com/xiralokola/edit?html,js,output

// friends.js

$(function () {
  'use strict';
  
  function Friends() {
    var settings = {
      name: null,
      age: null,
      gender: null,
      printTarget: null
    };
  }
  
  Friends.prototype = {
    getInfo: function () {
      var subject = (this.gender == 'female') ? 'She' : 'He',
          html = '<p>';
      html += '\'' + this.name + '\' is my friend.';
      html += subject + ' is' + this.age + ' years old.';
      html += '</p>';
      
      this.printTarget.append(html);
      return html;
    }
  };
  
  window.Friends = Friends;
  
});

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>Friends</title>
</head>
<body>
  
  <h1>Friends</h1>
  <div id="print"></div>

  <script src="https://code.jquery.com/jquery-1.11.3.js"></script>
  <script src="friends.js"></script>
  <script>
    var myFriend = new Friends({
      name: 'Hee-sook',
      age: 15,
      gender: 'female', 
      printTarget: $('#print')
    });
  </script>
  
</body>
</html>

我认为'var settings'附近有问题。但我不知道如何解决它。请帮帮我。

Answer 1

try this

你有3个问题：

你试图在定义之前调用一个Friends的实例（在这种情况下$（函数）应该在html上，而不是在js文件中）

应该是：

<script>
$(function () {
var myFriend = new Friends({
  name: 'Hee-sook',
  age: 15,
  gender: 'female', 
  printTarget: $('#print')
});

  });

你没有将设置对象传递给构造函数，应该是：

function Friends(settings) {
    $.extend(this,settings);
}

你没有在实例上调用getInfo（）：
```
myFriend.getInfo();
```

我想制作一个结构很好的代码。但我不能

1 个答案: